Jquery 全選、全不選、反選
阿新 • • 發佈：2018-12-30
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>全選，全不選，反選</title> <script src="../js/jquery-1.6.2.min.js" type="text/javascript"></script> <script language="javascript" type="text/javascript"> $(function () { $("#selectAll").click(function () {//全選 $("#fruitList input:checkbox").attr("checked", true); }); $("#unSelect").click(function () {//全不選 $("#fruitList input:checkbox").attr("checked", false); }); $("#reverse").click(function () {//反選 $("#fruitList input:checkbox").each(function () { $(this).attr("checked", !$(this).attr("checked")); }); }); }); </script> </head> <body> <div id="fruitList"> <input type="checkbox" value="蘋果1" />蘋果1<br /> <input type="checkbox" value="蘋果2" />蘋果2<br /> <input type="checkbox" value="蘋果3" />蘋果3<br /> <input type="checkbox" value="蘋果4" />蘋果4<br /> <input type="checkbox" value="蘋果5" />蘋果5<br /> <input type="checkbox" value="蘋果6" />蘋果6 </div> <input type="button" value="全選" id="selectAll" /> <input type="button" value="全不選" id="unSelect" /> <input type="button" value="反選" id="reverse" /> </body> </html>