複選框和<select>選項不會保留在HTML 5本地存儲中

我對HTML5本地存儲持久性和輸入有了意想不到的結論。當我使用< input type =「text」>或< input type =「textarea」>時，數據會保留在本地存儲中，並且在按下按鈕時頁面加載會重新加載到字段中。但是當我使用type =「radio」type =「checkbox」或< select> options時，這些類型的數據都不會存在。複選框和<select>選項不會保留在HTML 5本地存儲中

這是行爲的設計，我推着磚牆試圖使它工作，或者它是我的表單元素腳本需要大修嗎？如果是通過設計，那麼你可以回答是的。如果沒有，你可以在下面查看我的工作細節，給它一個檢查和任何反饋。

用戶將數據輸入到文本區域字段是這樣的：

<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(); 

       } 
      }

當用戶返回到頁面時，他點擊此按鈕來填充該頁面上的字段E：

<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」不起作用。如果「複選框」是由「無線電」取代它不工作，要麼：

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

我通過PhoneGap的1.0整合做這個項目與HTML，CSS和Javascript的iPhone。

來源

2011-09-29 Steve

爲我好以下工作：

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"]; 
}

設置和檢索當你有雙重檢查你的存儲鑰匙？

來源

2011-09-29 15:25:22 DoctorMick

我注意到，如果我在名稱和id中使用數字1（「s1frontTowerMtgShock」，它不會持續，如果我從名稱和id（「frontTowerMtgShock」）中刪除1，則它仍然存在。 < select >選項 – Steve

單選按鈕仍然不起作用： \t input type =「radio」name =「 frontTowerMtgShockCheck「id =」frontTowerMtgShockTwo「value =」2-middle「> \t – Steve

function persistData（）contains var frontTowerMtgShockCheck = document.form1 [「frontTowerMtgShockCheck」] value; var storageIndex =「pr acticelog.html.frontTowerMtgShockCheck「; localStorage [storageIndex] = frontTowerMtgShockCheck; – Steve

複選框和<select>選項不會保留在HTML 5本地存儲中

回答

相關問題