Maison > Article > interface Web > Exemples de cases à cocher opérationnelles jQuery pour implémenter plusieurs sélections et désélections
Dans un article précédent, nous vous avons présenté une explication détaillée de la méthode jQuery de fonctionnement des cases à cocher. Maintenant que nous avons compris la méthode des cases à cocher, comment utiliser la case à cocher pour réaliser des sélections multiples ? Aujourd'hui, nous allons vous présenter un exemple d'utilisation de jQuery pour utiliser une case à cocher afin de réaliser plusieurs sélections et désélections !
Jetons d'abord un coup d'oeil aux rendus :
<html> <head> <title></title> <script src="jquery-1.8.3.min.js"></script> <script> function check() { var code = ""; //$("input[name=chkname][value=AAAAA],[value=BBBBB]").attr("checked", true);//固有属性 $("input[name=chkname][value=AAAAA],[value=BBBBB]").prop("checked", true);//自定义的DOM属性 } function clearcheck() { $("input[name=chkname]").removeAttr("checked"); } </script> </head> <body> <input type="checkbox" value="AAAAA" name="chkname" />AAAAA <input type="checkbox" value="BBBBB" name="chkname" />BBBBB <input type="checkbox" value="CCCCC" name="chkname" />CCCCC <input type="checkbox" value="DDDDD" name="chkname" />DDDDD <br /> <input id="btnCheck" type="button" value="选中[value=AAAAA],[value=BBBBB]" onclick="check()" /> <input id="btnClear" type="button" value="取消选中" onclick="clearcheck()" /> <br /> <pre class="brush:php;toolbar:false"> 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。 对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法。 如果在ajax加载方式,attr无效时就使用prop。 <html> <head> <title></title> <script src="jquery-1.8.3.min.js"></script> <script> function check() { var code = ""; $("input[name=chkname][value=AAAAA],[value=BBBBB]").attr("checked", true); } function clearcheck() { $("input[name=chkname]").removeAttr("checked"); } </script> </head> <body> <input type="checkbox" value="AAAAA" name="chkname" />AAAAA <input type="checkbox" value="BBBBB" name="chkname" />BBBBB <input type="checkbox" value="CCCCC" name="chkname" />CCCCC <input type="checkbox" value="DDDDD" name="chkname" />DDDDD <br /> <input id="btnCheck" type="button" value="选中[value=AAAAA],[value=BBBBB]" onclick="check()" /> <input id="btnClear" type="button" value="取消选中" onclick="clearcheck()" /> </body> </html>