HTML5 localStorage對複選框執行操作

按照此處的教程http://css-tricks.com/video-screencasts/96-localstorage-for-forms/。我能夠使用提交按鈕重新創建功能，但是，而不是按鈕，是否可以使用複選框？HTML5 localStorage對複選框執行操作

這裏是我到目前爲止，

if (localStorage) { 

$(function() { 

    // Insert new buttons 
    $("#savelinks") 
     .after("<input type='submit' value='Save Address' id='saveData'> &nbsp;&nbsp;") 
     .after("<input type='submit' value='Clear Saved Address' id='clearData'>"); 

    $("#saveData") 
     .click(function(e) { 

        e.preventDefault(); 
        // Test if saved data exists on page load 
        localStorage.setItem("flag", "set"); 
        var data = $("#form1").serializeArray(); 

        // iterate over results 
        $.each(data, function(i, obj) { 

            localStorage.setItem(obj.name, obj.value); 

        }); 

     }); 



    if (localStorage.getItem("flag") == "set") { 
     var data = $("#form1").serializeArray(); 
     $.each(data, function(i, obj) { 
      $("[name='" + obj.name +"']").val(localStorage.getItem(obj.name)); 
     }); 
    } 



    $("#clearData") 
     .click(function(e) { 
      e.preventDefault(); 
      localStorage.setItem("flag", ""); 
     }); 
}); 
}

預先感謝您！

來源

2013-03-04 Richard

是的，但爲什麼使用複選框來保存和清除數據？ – Stefan 2013-03-04 18:15:54

要有類似[]保存地址的內容，勾選此框將保存地址以供將來使用，並取消選中該地址將清除它。 – Richard 2013-03-04 18:18:03

使用change事件並查看是否選中該複選框;

$('#MyCheckbox').change(function() { 

    var $this = $(this), // Current checkbox 
     isChecked = this.checked, // We can also use $this.prop('checked') 
     data = $('#form1').serializeArray(); 

    if (isChecked) { 
    // Store serialized form data 
    } else { 
    // Clear stored form data 
    } 

});

來源

2013-03-04 18:29:55 Stefan

HTML5 localStorage對複選框執行操作

回答

相關問題