在取復選框checkbox的屬性checked屬性值時，發(fā)現(xiàn)一個問題，就是當用attr取值時，真的為"checked",假的為"undefined";當用prop取值時，真的為"true",假的為"false"。經(jīng)過網(wǎng)上參考一些資料，及根據(jù)官方的建議這兩個用法：具有 true 和 false 兩個屬性的屬性，如 checked, selected 或者 disabled 使用prop()，其他的使用 attr()。

方法一：

全選、不選、反選 1

$(function(){

$('.check .btn1').click(function(){//全選

$('.music :checkbox').prop('checked',true);

});

$('.check .btn2').click(function(){//全不選

$('.music :checkbox').prop('checked',false);

});

$('.check .btn3').click(function(){//反選

$('.music :checkbox').each(function(){

$(this).prop('checked',!$(this).prop('checked'));

});

});

});

小白兔

小燕子

哈巴狗

小青蛙

數(shù)鴨子

全選

全不選

反選

方法二：

全部由jquery動態(tài)生成

function checkAll(){//全選

$(":checkbox").prop("checked",true);

}

function checkNo(){//全不選

$(":checkbox").prop("checked",false);

}

function checkRev(){//反選

$(":checkbox").each(function(){

$(this).prop("checked",!$(this).prop("checked"));

});

}

$(function(){

var sec=$("

var input="";//創(chuàng)建一個空的變量

for(var i=0;i<5;i++){

var index=i+1;

input+=""+"標題"+index+"
";

}//把從0到4每一個創(chuàng)建的input收集到空變量里面

sec.append(input);//再把這些收集到的所有input追加到div里面

sec.append($("全選"));//創(chuàng)建全選按鈕，并追加到div里面

sec.append($("全不選"));//創(chuàng)建全不選按鈕，并追加到div里面

sec.append($("反選"));//創(chuàng)建反選按鈕，并追加到div里面

});

以上就是本文的全部內(nèi)容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。

總結(jié)

以上是生活随笔為你收集整理的html实现全选 反选,jquery实现全选、不选、反选的两种方法的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。