<body>
<input type="checkbox" class="item">Item</input>
<input type="checkbox" class="item">Item</input>
<input type="checkbox" class="item">Item</input>
<input type="checkbox" class="item">Item</input>
<input type="checkbox" class="item">Item</input>
<br/>
<button id="bt-check">Check</button>
<button id="bt-uncheck">Uncheck</button>
<button id="bt-reverse">Reverse</button>
</body>
<script>
$(function () {
//给jQuery结果集对象扩展全选方法
var actionHandler = {
check: function () {
//全部选择
this.prop("checked", true);
},
uncheck: function () {
//全部取消
this.prop("checked", false);
},
reverse: function () {
//逐个反选
this.each(function () {
this.checked = !this.checked;
});
}
};
jQuery.fn.extend(actionHandler);
//绑定事件
$("#bt-check").click(() => {
$(".item").check();
});
$("#bt-uncheck").click(() => {
$(".item").uncheck();
});
$("#bt-reverse").click(() => {
$(".item").reverse();
});
});
</script>
【Javascript】【jQuery】通过jQuery方法扩展,简化全选功能代码
猜你喜欢
转载自blog.csdn.net/u013718730/article/details/89948410
今日推荐
周排行