jQuery prop() 方法在复选框全选与反选中的应用

jQuery prop() 方法简介

在查阅 jQuery 官方文档后，我对 prop() 函数的用法有了更深的理解。由于记忆容易模糊，特此记录这些关键点以备后续查阅。

prop() 方法的主要功能是获取匹配元素集合中第一个元素的指定属性值。

判断复选框选中状态

若要判断页面上第一个复选框是否处于选中状态，可以通过该方法获取其 checked 属性的值来实现。

$(":checkbox").prop("checked"); //如果第一个checkbox被选中返回true,否则返回false.

批量设置复选框状态

如果需要禁用页面上所有的复选框，或者将它们全部设置为选中状态，可以直接调用 prop() 并传入相应的属性名与布尔值。

$("input[type='checkbox']").prop("disabled", true);
$("input[type='checkbox']").prop("checked", true);

实现复选框反选功能

对于页面上所有的复选框，若需实现反选功能，即把选中的变为未选中，未选中的变为选中，可以通过传递一个回调函数来处理。该函数接收索引和当前值作为参数，返回取反后的布尔值即可。

$("input[type='checkbox']").prop("checked", function( i, val ) {  //i:索引 val:true/false(选中为true,否则为false)
 return !val;
});

以上就是利用 jQuery prop() 函数实现复选框全选与反选功能的完整内容。希望这些示例能为大家提供有效的参考，欢迎收藏与支持。