A lot of examples on the Web are as follows:
<! 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" xml:lang="en"> <head> <meta http-equiv="Content-type" Content="text/html; Charset=utf-8 "> <title>Test</title> <script type="text/javascript" src="Jquery-1.9.1.js"> </script> <script type="Text/javascript">$( function () { //Select all$("#btnCheckAll"). Bind ("click", function () {$("[name = Chkitem]:checkbox"). attr ("Checked",true); });//Do not select all$("#btnCheckNone"). Bind ("click", function () {$("[name = Chkitem]:checkbox"). attr ("Checked",false); });//Reverse selection$("#btnCheckReverse"). Bind ("click", function () {$("[name = Chkitem]:checkbox"). each ( function () {$( This). attr ("Checked", !$( This). attr ("Checked")); }); });//Do not select all$("#btnSubmit"). Bind ("click", function () { varresult =New Array(); $("[name = Chkitem]:checkbox"). each ( function () { if($( This). Is (": Checked") {Result.push ($ ( This). attr ("Value")); } }); Alert (Result.join (",")); }); });</script></head><body> <div> <input name="Chkitem" type="checkbox" value=" Today's topic " />Today's Topic<input name="Chkitem" type="checkbox" value ="visual Focus" />Visual focus<input name="Chkitem" type="checkbox" value="Finance" />Financial<input name="Chkitem" type="checkbox" value ="Car" />Car<input name="Chkitem" type="checkbox" value="Technology" />Technology<input name="Chkitem" type="checkbox" value ="Property" />Property<input name="Chkitem" type="checkbox" value="Travel" />Tourism</div> <div> <input id="Btncheckall" type="button" value ="Select All" /> <input id="Btnchecknone" type="button" value=" No choice " /> <input id="Btncheckreverse" type="button" value ="Reverse selection" /> <input id="btnsubmit" type="button" value="Commit" /> </div></body></html>
After running, under Firefox found a problem that baffled the solution
Problem Description: The first point to select All can, and then click on the whole selection, then click on the Select all, all do not select, the reverse selection will not react, and later with other browsers to send can, so the feeling is compatibility problem, later access to the data found that is true, reference address http://jquery.com/
Workaround: Change the attr to prop , after verifying that each browser is good, the official website is recommended in 1.6 after the proposed use of prop, in this record for later use
Down to
Copyright NOTICE: This article for Bo Master original article, without Bo Master permission not reproduced.
The prop&attr of a checkbox in jquery