本文介绍了一种使用jQuery简化全选按钮与多个checkbox联动的方法。通过触发click事件，可以轻松实现全选或取消所有选项的功能。适用于网页表单操作等场景。
需求：当点击全选按钮时，所有的checkbox框被选中或取消
实现思路：当全选按钮click函数触发，利用trigger函数自动模拟checkbox的click事件
实现代码如下
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src='sources/jquery-1.9.1.min.js'></script>
<title>测试函数</title>
</head>
<body>
<div>
<div>
<button id='select_all_btn'>全选</button><br/>
<input type="checkbox" name="hobby"/>爬山
<input type="checkbox" name="hobby"/>跑步
<input type="checkbox" name="hobby"/>看电影
</div>
</div>
</body>
</html>
<script type="text/javascript">
$(document).ready(function(){
//当全选按钮触发时,所有checkbox被点击一次
$('#select_all_btn').bind('click',function(event){
$('input[type="checkbox"]').trigger('click');
});
});
</script>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
