<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="jquery-1.8.3.js"></script> </head> <body> <button>全选</button> <button>全不选</button> <button>反选</button> <hr> <div id="main"> <input type="checkBox">篮球 <br> <input type="checkBox">羽毛球 <br> <input type="checkBox">乒乓球 <br> <input type="checkBox">足球 <br> <input type="checkBox">橄榄球 <br> <input type="checkBox">棒球 </div> </body> <script type="text/javascript"> // 第一种方法 // 全选 /$('button').eq(0).click(function(){ $('input').attr('checked',true); }); // 全不选 $('button').eq(1).click(function(){ $('input').attr('checked',false); }); // 反选 $('button').eq(2).click(function(){ $('input').each(function(){ this.checked=!this.checked; }); });/

// 第二种方法: // 全选 $('button:eq(0)').click(function(){ $(':checkBox').attr({'checked':true}); }); // 全不选 $('button:eq(1)').click(function(){ // 表单选择器 $(':checkBox').attr({'checked':false}); }); // 反选 $('button:eq(2)').click(function(){ // 遍历每一个checkBox $(':checkBox').each(function(){ $(this).attr({'checked':!$(this).attr('checked')}); }); }); </script> </html>