使用jQuery做複選框的全選與取消
阿新 • • 發佈:2018-11-16
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script> </head> <body> <input type="checkbox" id="qx" />全選<br> <input type="checkbox" class="abc" /><br /> <input type="checkbox" class="abc" /><br /> <input type="checkbox" class="abc" /><br /> </body> <script type="text/javascript"> $("#qx").click(function(){ //得到id="qx"的標籤的checked屬性的值 var x= $("#qx").prop('checked'); //將class屬性為.abc的標籤的checked屬性設定成x $(".abc").prop('checked',x); }) </script> </html>
其中的下邊這句程式碼可以做更換:
$(".abc").prop('checked',x);
上邊這行程式碼可以更換為:
//迴圈遍歷class屬性為.abc的標籤
$(".abc").each(function(){
//this表示每次遍歷到的標籤
$(this).prop('checked',x);
})