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/