一棵树

路漫漫其修远兮 吾将上下而求索。

导航

Jquery 一些有用的代码片段

1:点击一个全选按钮下面的按钮全都选中

$(function(){
selectable = $(":checkbox.selectable");
$("#selectall").click(function(){
$(this).attr("checked",true);
selectAll();
});
// describing how many are checked
selectable.click(changeNumFilters);
// calculate how many are initially checked
changeNumFilters();
})

function selectAll(){
var checked = $("#selectall").attr("checked");
selectable.each(function(){
var subChecked = $(this).attr("checked");
if(subChecked != checked){
$(this).attr("checked",true);
}
});
changeNumFilters();
}

function changeNumFilters()
{
// this needs to be checked on every call
// since the length can change with every click
var size = $(":checked.selectable").length;
if (size > 0)
$("#selectedCount").html(size);
else
$("#selectedCount").html("0");
}

-----------------------------------------

 2:

[JQuery]選取所有checkbox和判斷是否全部checkbox已經被勾選

<form>
<input type="checkbox" id="checkAll">quanxian
<hr/>
<input type="checkbox" name="chkPerson">hello<br/>
<input type="checkbox" name="chkPerson">ni<br/>
<input type="checkbox" name="chkPerson">hao<br/>
</form>

后端代码:

$(function(){

$('#checkAll').change(function() {
//get all checkbox which want to change
var checkboxes = $(this).closest('form').find('input[name="chkPerson"]:checkbox');
if($(this).is(':checked')) {
    checkboxes.prop('checked', 'checked');
} else {
    checkboxes.removeAttr('checked');
}
});
$('input[name="chkPerson"]').change(function(){
     checkOrRemoveCheckAll();
});
});

function checkOrRemoveCheckAll(){
if($('input[name="chkPerson"]:checked').length == $('input[name="chkPerson"]').length)
{
     $('#checkAll').prop("checked", "checked");
}
else
{
     $('#checkAll').removeAttr("checked");
}
}

posted on 2014-11-20 14:03  nxp  阅读(83)  评论(0编辑  收藏  举报