将多个复选框保存到本地存储中而不会被覆盖

Question

我有一个复选框，我希望它在提交表单时向本地存储写入复选框的状态（true/false）。

因此，如果用户选中该框并单击提交，则存储在本地存储中的值将为“true”。然而，我不想要的是，如果用户重新打开应用程序并再次提交表单，数据将被覆盖，例如，如果用户下次重新打开应用程序并决定不检查该应用程序特定会话中，localstorage中的值应该是“true，false”等等。

我想我应该使用JSON.stringify，但不确定如何融入到这里。

这里是我的JS（我使用的PhoneGap）

document.addEventListener("deviceready",onDeviceReady,false); 

function onDeviceReady() { 
      document.getElementById("xbutton").addEventListener("click",savecheck,false); } 

function savecheck(){ 
     var checkb = document.getElementById("MedA"); 
     localStorage.setItem("MedA", checkb.checked); 
    } 

HTML：

<form> 
      <div id='medA'> 
       <input type="checkbox" id="MedA" name="Med" value="A">Medication A 
      </div> 
<input id="xbutton" type="button" onClick="savecheck()" value="Submit"> 
</form> 

Answer 1

而且现在在jQuery的：

var MedA = [100]; 
localStorage.setItem("index",0); 

function savecheck(){ 

    if($('input[name="chk[]"]:checked')){ 
     MedA[localStorage.getItem("index")] = $('input[name="chk[]"]').val(); 
     localStorage.setItem("index",localStorage.getItem("index")+1); 
     localStorage.setItem("MedA", JSON.stringify(MedA)); 
    } 


} 

获得从本地存储使用

function getSavedcheck(){ 

    var storedMedA = JSON.parse(localStorage.getItem("MedA")); 

    return storedMedA; 
} 

Answer 2

您应该从localStorage的加载复选框的状态，所以这时如果用户提交表单，而无需修改复选框的状态，也不会被改变：

document.addEventListener("deviceready",onDeviceReady,false); 

function onDeviceReady() { 
    document.getElementById("xbutton").addEventListener("click",savecheck,false); 
    document.getElementById("xbutton").checked = localStorage.getItem("MedA"); 
} 

function savecheck(){ 
    var checkb = document.getElementById("MedA"); 
    localStorage.setItem("MedA", checkb.checked); 
}