Question

我已尽力搜索所有答案，但找不到任何具体的答案。所以，如果你找到了什么，请告诉我，我马上将其删除。

我创建了一个JSFiddle来显示我的问题（为了便于参考，下面复制了JS部分）：http://jsfiddle.net/hg67R/1/

当我尝试根据变量的值设置复选框的值时，它似乎无法正确设置。我创建的示例应该保存每个复选框的当前状态（这是正确的）。然后，无论您如何更改这些复选框，它都应该在您单击加载时将其更改回来。存储变量是正确的，但它没有正确设置复选框。我确定这是明显的，但我肯定看不到它。

function save() {
    localStorage.setItem("numbers", document.getElementById("Numbers").checked);
    localStorage.setItem("tips", document.getElementById("Tips").checked);
}

function load() {
    document.getElementById("Numbers").checked = localStorage.numbers;
    document.getElementById("Tips").checked = localStorage.tips;

    console.log("numbers storage: " + localStorage.numbers);
    console.log("numbers box: " + document.getElementById("Numbers").checked);
    console.log("tips storage: " + localStorage.tips);
    console.log("tips box: " + document.getElementById("Tips").checked);
}

console.logs只显示变量正在正确存储和加载。

谢谢！

Answer 1

除了mrk他的回答

http://jsfiddle.net/Icepickle/NVw3L/

最大的变化是我检查localStorage值是否与＆＃34; true＆＃34;

完全一致

document.getElementById("Numbers").checked = localStorage.numbers === 'true';

Answer 2

两件事：

Localstorage存储字符串键和字符串值

此处清楚地描述了复选框的已检查属性的正确值：

What's the proper value for a checked attribute of an HTML checkbox?

具体来说，这部分：

开关是＆＃34;开＆＃34;当设置了控制元素的检查属性时。

这意味着它与放在那里的东西并不重要   事实上它只需要定义。以下所有内容都将是   检查：

<input name="checkbox_name" id="checkbox_id" type="checkbox" checked>
<input name="checkbox_name" id="checkbox_id" type="checkbox" checked="yes"> 
<input name="checkbox_name" id="checkbox_id" type="checkbox" checked="no"> 
<input name="checkbox_name" id="checkbox_id" type="checkbox" checked="blue">
<input name="checkbox_name" id="checkbox_id" type="checkbox" checked="false">

只有以下内容未经检查：

<input name="checkbox_name" id="checkbox_id" type="checkbox">

Javascript - 如何根据变量设置复选框

2 个答案: