Javascript-如何使用我當前的代碼檢查“某些”復選框，而不是全部？

Question

因此，我有兩個表在一頁上彈出。 這是我以前用來選擇第一個表中的所有復選框（當時是唯一的一個）的腳本：

<script>
  $('#selectAll').click(function() {
   if(this.checked) {
     $(':checkbox').each(function() {
       this.checked = true;                        
     });
   } else {
    $(':checkbox').each(function() {
     this.checked = false;                        
   });
  } 
});
</script>

我該如何更改使其更具體？ 我是否需要在復選框中添加特定的類或ID屬性才能使其正常工作？

Answer 1

假設兩個表都具有類.table 。 適用於兩個表的腳本的優化版本如下所示：

$('.table').on('click', '.selectAll', function(e) {
    $(':checkbox', e.delegateTarget).prop('checked', this.checked);
});

筆記：

1. 取而代之的ID #selectAll您的選擇，所有的復選框必須有一流的 .selectAll 。

2. 使用.on方法，我們將單擊事件處理程序綁定到表，該事件處理程序在單擊.selectAll時觸發。 e.delegateTarget指向當前表DOMElement。 然后$(':checkbox', e.delegateTarget)表示find checkboxes within current table 。

3. 除了使用each方法循環並設置checked = true/false您可以使用jQuery的prop方法來執行相同但更簡潔的操作。

演示： http ： //jsfiddle.net/pkp7osfn/