复选框和 <select> 选项不会保留在 HTML 5 本地存储中

Question

关于 HTML5 本地存储持久性和输入，我得出了一个意想不到的结论。当我使用 或 时，数据会保留在本地存储中，并且在页面加载时，只需按一下按钮，就会加载回字段中。但是当我使用 type="radio" type="checkbox" 或 选项时，这些类型的数据都不会保留。

这种行为是设计使然，并且我正在努力使其工作，还是我的表单元素脚本需要大修？如果是设计使然，那么您可以回答是。如果没有，您可以在下面查看我的工作详细信息，以进行检查和反馈。

用户将数据输入到 textarea 字段中，如下所示：

<textarea name="s1frontTowerShockMtgOther" id="s1frontTowerShockMtgOther" cols="20" rows="4">

然后他们点击保存按钮，编码如下：

<input type="button" value="Save Settings" onclick="persistData()" style="background-color:red; font-weight:bold">

Javascript 页面发挥了它的魔力：

function persistData()
            {
                if (html5StorageSupported())
                {
                    var s1frontTowerShockMtgOther = document.form1["s1frontTowerShockMtgOther"].value;
                    var storageIndex = "practicelog.html.s1frontTowerShockMtgOther";
                    localStorage[storageIndex] = s1frontTowerShockMtgOther;

                document.form1.numStored.value = determineNumberStoredElements();

                }
            }

当用户返回页面时，他点击此按钮以填充该页面上的字段：

<input class="loadButton" type="button" value="Load Data First" onclick="loadData()">

Javascript被调用：

function loadData()
        {
         document.form1["s1frontTowerShockMtgOther"].value = localStorage["practicelog.html.s1frontTowerShockMtgOther"];

         } 

就是这样。以下方法不起作用：

<select size="1" name="frontTowerMtgShock" id="frontTowerMtgShock">
        <option value="">Tap to choose</option>
        <option value="0 spacers">3-outer</option>
        <option value="1 spacer">2-middle</option>
        <option value="2 spacers">1-inner</option>
        <option value="other">See notes</option>
    </select>

下面的 type="checkbox" 不起作用。如果“checkbox”被“radio”替换，它也不起作用：

<input type="checkbox" name="s1frontTowerMtgShock3" id="s1frontTowerMtgShock3" value="3-outer">

我正在通过PhoneGap 1.0 集成使用HTML、CSS 和Javascript 为iPhone 做这个项目。

Answer 1

以下对我来说很好用：

function persistData()
{
    var s1frontTowerShockMtgOther = document.form1["s1frontTowerShockMtgOther"].value;
    var storageIndex = "practicelog.html.s1frontTowerShockMtgOther";
    localStorage[storageIndex] = s1frontTowerShockMtgOther;
    storageIndex = "practicelog.html.frontTowerMtgShock";
    var frontTowerMtgShock = document.form1["frontTowerMtgShock"].value;
    localStorage[storageIndex] = frontTowerMtgShock;
}

function loadData()
{
     alert(localStorage["practicelog.html.frontTowerMtgShock"]);
     document.form1["frontTowerMtgShock"].value = localStorage["practicelog.html.frontTowerMtgShock"];
 } 

您在设置和检索时是否仔细检查了您的存储密钥？