使用jQuery選中/取消選中單個復選框

Question

我有一個包含30多個復選框的HTML頁面（

如何配置此腳本以僅記住我選中的復選框（僅記住該復選框已選中或未選中）

這是我使用的腳本：

$(function(){
    var test = localStorage.input === 'true'? true: false;
    $('input').prop('checked', test || false);
});

$('input').on('change', function() {
    localStorage.input = $(this).is(':checked');
    console.log($(this).is(':checked'));
});

Answer 1

$('input')匹配所有輸入。 給它一個更具體的選擇器（最好是您要記住的輸入的id 。

Answer 2

此代碼保存會話之間所有復選框的狀態：

$('input[type=checkbox]').each(function(idx) {
  this.checked= localStorage.getItem('input'+idx) === 'true';
});

$('input[type=checkbox]').each(function(idx) {
  $(this).click(function() {
    localStorage.setItem('input'+idx, this.checked);
  });
});

小提琴1

---

如果添加，切換或刪除輸入，則需要使用其他方法。

如果每個輸入都有一個id ，則可以改用以下代碼：

 $('input[type=checkbox]').each(function(idx) { this.checked= localStorage.getItem('input'+this.id) === 'true'; }); $('input[type=checkbox]').click(function() { localStorage.setItem('input'+this.id, this.checked); }); 

小提琴2