在Web开发中,经常需要对一组数据进行批量操作。其中之一是对多个复选框进行批量选择或反选操作。jQuery提供了简单易用的方法来实现这些功能。
批量选择
当我们需要将一组复选框全部选中时,可以使用以下代码:
-- ----------------------------- ------------------------------------------- ------
解析:$("input[name='checkbox']")
选取了所有name属性值为"checkbox"的input元素,.prop("checked", true)
将它们的checked属性设置为true,即全选。
批量反选
当我们需要将一组已选中的复选框全部取消选中,未选中的全部选中时,可以使用以下代码:
-- ------------------------------------------ ------------------------------------------- - ----------------------- -------------------------- ---
解析:$("input[name='checkbox']")
选取了所有name属性值为"checkbox"的input元素, .each()
遍历每个元素,$(this)
获取当前元素的jQuery对象,.prop("checked")
获取checked属性的值,!
取反操作,最后再将新的值赋给checked属性。
示例代码
--------- ----- ------ ------ ----- ---------------- --------------------------------- ------- ---------------------------------------------------------------------------- ------- ------ ---- ------------------ ----- ------- --------------------------- ------- ------------------------------- -------- ------ --------------- --------------- ---------- -------- ----- ------ --------------- --------------- ---------- -------- ----- ------ --------------- --------------- ---------- -------- ----- ------ --------------- --------------- ---------- -------- ----- ------ --------------- --------------- ---------- -------- ----- -------- ------------ - --------------------------------- - ------------------------------------------- ------ --- ------------------------------------- - ------------------------------------------- - ----------------------- -------------------------- --- --- --- --------- ------- -------
该示例中,我们使用了jQuery库,并在页面上放置了一组复选框和两个按钮(全选和反选)。当点击对应按钮时,就会执行相应的jQuery代码来进行批量选择或反选操作。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/3379