javascript - localStorage.removeItem 无法正常工作。我该如何解决？

Question

我有这个代码用于保存来自 2 个输入的数据。当页面刷新两次(数据已保存)时，一切都很好，但在第三次刷新时，日期消失了。我知道这是因为 localStorage.removeItem ，但我需要在标签消失后数据消失。
我对其他东西使用相同的方法，并且效果很好。但在这种情况下，这就是我所说的，只需要 2 次刷新。

<input type="date" id="exdated" name="" 
        onfocus="localStorage.setItem('myTestApp','exdated')" 
        onkeyup="saveValue(this);">
<br><br> 
<input type="date" id="datata" name="" 
        onfocus="localStorage.setItem('myTestApp','datata')" 
        onkeyup="saveValue(this);">
<br><br>

let today = new Date().toISOString().slice(0, 10)

document.getElementById("datata").value = getSavedValue("datata"); 
document.getElementById("exdated").value = getSavedValue("exdated"); 

function saveValue(e) {
    var id = e.id;  
    var val = e.value; 
 
    localStorage.setItem(id, val); 
}

function getSavedValue  (v) {
    if (!localStorage.getItem(v)) {
      return today;
    }

    var itemcheta = localStorage.getItem(v);
    localStorage.removeItem(v); 
    
    return itemcheta;
}

Answer 1

由于您希望在浏览器选项卡关闭时数据消失，您应该使用 sessionStorage 而不是 localStorage .这将使浏览器在浏览 session 关闭时处理正确的数据删除，因此需要担心的代码更少。