Jquery 復選框全選與反選點擊執行一次然後失效解決方案
代碼需求， 使用attr只能執行一次，使用prop則完美實現全選和反選，獲取所有選中的項並把選中項的文本組成一個字符串。
解決方案一：
代碼如下：
<html>
<head>
<script src="jquery-1.11.1.min.js" type="text/javascript"></script>
</head>
<body>
<input type="checkbox" name="chk_list[]" value="1" />1
<input type="checkbox" name="chk_list[]" value="2" />2
<input type="checkbox" name="chk_list[]" value="3" />3
<input type="checkbox" name="chk_list[]" value="4" />4
<input type="checkbox" name="chk_all" id="chk_all" />全選/取消全選
<script type="text/javascript">
$("#chk_all").click(function(){
// 使用attr只能執行一次
$("input[name=‘chk_list[]‘]").attr("checked", $(this).attr("checked"));
// 使用prop則完美實現全選和反選
$("input[name=‘chk_list[]‘]").prop("checked", $(this).prop("checked"));
// 獲取所有選中的項並把選中項的文本組成一個字符串
var str = ‘‘;
$($("input[name=‘chk_list[]‘]:checked")).each(function(){
str += $(this).next().text() + ‘,‘;
});
alert(str);
});
</script>
</body>
</html>總結：
對於HTML元素本身就帶有的固有屬性，在處理時，使用prop方法。
對於HTML元素我們自己自定義的DOM屬性，在處理時，使用attr方法。
參考 http://www.jb51.net/article/62308.htm
<script type="text/javascript">
jQuery(function($) {
// 給全選添加點擊事件
$("[name=‘allSel‘]").click(function(){
if($(this).is(‘:checked‘)){
$("[name=‘select‘]").prop(‘checked‘,true);
}else{
$("[name=‘select‘]").prop(‘checked‘,false);
}
});
//給復選框添加點擊事件
$("[name=‘select‘]").click(function(){
var allSel = false;
$("[name=‘select‘]").each(function(){
if(!$(this).is(‘:checked‘)){
allSel = true;
}
})
//如果有checkbox沒有被選中
if(allSel){
$("[name=‘allSel‘]").prop(‘checked‘,false);
}else{
$("[name=‘allSel‘]").prop(‘checked‘,true);
}
})
});
</script>
Jquery 復選框全選與反選點擊執行一次然後失效解決方案