Question

怎么用jquery通过点击全选按钮实现全选 全不选

Answer 1

方法/步骤

HTML代码：
<table>
<tr>
<td><input type="checkbox" name="b">全选</td><td>内容</td>
</tr>
<tr>
<td><input type="checkbox" name="a"></td><td>复选1</td>
</tr>
<tr>
<td><input type="checkbox" name="a"></td><td>复选2</td>
</tr>
<tr>
<td><input type="checkbox" name="a"></td><td>复选3</td>
</tr>
<tr>
<td><input type="checkbox" name="a"></td><td>复选4</td>
</tr>
<tr>
<td><input type="checkbox" name="a"></td><td>复选5</td>
</tr>
<tr>
<td><input type="checkbox" name="a"></td><td>复选6</td>
</tr>
</table>
JAVASCRIPT代码：
<script>
$("input[name='b']").click(function(){
//判断当前点击的复选框处于什么状态$(this).is(":checked") 返回的是布尔类型
if($(this).is(":checked")){
$("input[name='a']").prop("checked",true);
}else{
$("input[name='a']").prop("checked",false);
}
});
</script>
3
这样就实现了全选和全不选

Answer 2

HTML代码：

<table>

<tr>

<td><input type="checkbox" name="b">全选</td><td>内容</td>

</tr>

<tr>

<td><input type="checkbox" name="a"></td><td>复选1</td>

</tr>

<tr>

<td><input type="checkbox" name="a"></td><td>复选2</td>

</tr>

<tr>

<td><input type="checkbox" name="a"></td><td>复选3</td>

</tr>

<tr>

<td><input type="checkbox" name="a"></td><td>复选4</td>

</tr>

<tr>

<td><input type="checkbox" name="a"></td><td>复选5</td>

</tr>

<tr>

<td><input type="checkbox" name="a"></td><td>复选6</td>

</table>

JAVASCRIPT代码：

<script>

$("input[name='b']").click(function(){

//判断当前点击的复选框处于什么状态$(this).is(":checked") 返回的是布尔类型

if($(this).is(":checked")){

$("input[name='a']").prop("checked",true);

}else{

$("input[name='a']").prop("checked",false);

}

});

</script>

3

这样就实现了全选和全不选。