首页 > 代码库 > jQuery 实现全选，反选，取消
jQuery 实现全选，反选，取消
代码如下：
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><input type="button" value="http://www.mamicode.com/全选" onclick="checkAll()" /> <input type="button" value="http://www.mamicode.com/反选" onclick="reserveAll()" /> <input type="button" value="http://www.mamicode.com/取消" onclick="cancleAll()"/> <table border="1"> <thead> <tr><th>选择</th> <th>id </th> <th>name</th> <th>age</th> </tr> </thead> <tbody id="tb"> <tr> <td> <input type="checkbox"/></td> <td>1</td> <td>lcg</td> <td>22</td> </tr> <tr> <td><input type="checkbox"/></td> <td>2</td> <td>lcg2</td> <td>23</td> </tr> <tr> <td><input type="checkbox"/></td> <td>3</td> <td>lcg3</td> <td>24</td> </tr> </tbody> </table><script src="http://www.mamicode.com/jquery-3.1.1.js" ></script><script> function checkAll(){ $(‘#tb :checkbox‘).prop(‘checked‘,true); } function cancleAll(){ $(‘#tb :checkbox‘).prop(‘checked‘,false) } function reserveAll(){ $(‘#tb :checkbox‘).each(function(){ if (this.checked){ this.checked=false }else this.checked=true }) }</script></body></html>
JQuery 版反选（上面是mod版）
function reserveAll(){ $(‘#tb :checkbox‘).each(function() { if ($(this).prop(‘checked‘)) { $(this).prop(‘checked‘, false); } else { $(this).prop(‘checked‘, true); } }) }三元运算版反选
function cancleAll(){ $(‘#tb :checkbox‘).prop(‘checked‘,false) } function reserveAll(){ $(‘#tb :checkbox‘).each(function() { var v= $(this).prop(‘checked‘)?false:true; $(this).prop(‘checked‘,v) }) }
jQuery 实现全选，反选，取消
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。