Question

我对HTML5本地存储持久性和输入有了意想不到的结论。当我使用＆lt; input type =“text”＆gt;或者＆lt;输入类型=“textarea”＆gt;，然后数据在本地存储中保留，并且在页面加载时只需按一下按钮就可以加载回字段。但是当我使用type =“radio”type =“checkbox”或＆lt;选择＆gt;选项，这些类型的数据都不会持续存在。

这种行为是否是设计的，我正在推动试图使其工作的砖墙，或者是我的表单元素脚本需要大修？如果它是设计的，那么你可以回答是。如果没有，您可以在下面查看我的工作细节，以便进行检查和反馈。

用户将数据输入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>

以下类型=“复选框”不起作用。如果“复选框”被“无线电”替换，它也不起作用：

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

我正在使用HTML，CSS和Javascript通过PhoneGap 1.0集成为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"];
 }

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

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

1 个答案: