localStorage（需要幫助不正確 function） - Javascript Chrome 擴展

Question

var itemName;
var itemSize;
var itemType;
var itemColor;

window.onload = function() {
    document.getElementById('item_save').onclick = function() {

        var item_name = document.getElementById('item_name').value;
        var item_size = document.getElementById('item_size').value;
        var item_type = document.getElementById('item_type').value;
        var item_color = document.getElementById('item_color').value;

        console.log(item_name + "\t" + item_size + "\t" + item_type + "\t" + item_color + "\tsaving...");

        localStorage.setItem(itemName, item_name);
        localStorage.setItem(itemSize, item_size);
        localStorage.setItem(itemType, item_type);
        localStorage.setItem(itemColor, item_color);


    }

    var getItemName = localStorage.getItem(itemName);
    var getItemSize = localStorage.getItem(itemSize);
    var getItemType = localStorage.getItem(itemType);
    var getItemColor = localStorage.getItem(itemColor);

    console.log(getItemName + "\t" + getItemSize + "\t" + getItemType + "\t" + getItemColor + "\tsaved...")
}

假設我為 item_name 輸入輸入 1，為 item_size 輸入輸入 2，為 item_type 輸入輸入 3，為 item_color 輸入輸入 4，它會繼續在控制台中顯示為：

“4 4 4 4 保存...

1 2 3 4 節省..."

我想知道為什么它也首先顯示保存的console.log，並將保存的console.log 中的所有數字都設為4，需要建議。

Answer 1

“保存”控制台出現在“點擊”事件上。

“已保存”控制台出現在事件“加載”上。

當然，加載是在任何其他事件被觸發之前完成的，比如“點擊”。

就像@Pointy 說的那樣，“saveItem”和“getItem”的第一個參數應該是一個字符串。

通過這種方式，您將所有內容保存在“未定義”鍵下，並將所有內容保存在“未定義”鍵下。 然后，您只獲得了最后一次保存的值 4 次和第四次。