prevent already disabled checkbox from being checked when click on checkAll
Below is the code i am using for check all the check boxes.
jQuery("#checkAll").on('click',function() { // bulk checked
var status = this.checked;
jQuery(".selectRow").each( function() {
jQuery(this).prop("checked",status);
});
});
But already disabled checkbox is also checked when i click on CheckAll link. How to stop already disabled checkbox from being checked when click on checkAll link? Any help would be greatly appreciated.
You are almost there. Use the not(":disabled") filter with your current code and it will leave out those checkboxes which are disabled.
jQuery(".selectRow").not(":disabled")...
See this question which looks very similar: jquery selector for all checked checkboxes that are not disabled
您可以使用:not选择器来选择没有[disabled]属性的每个checkbox ：
$('#checkAll').on("click", function(event){
$('input[type="checkbox"]:not([disabled])').prop('checked', true)
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" /><br />
<input type="checkbox" disabled="disabled" /><br />
<input type="checkbox" /><br />
<input id="checkAll" type="button" value="check all" />A simple example on how it works
<!DOCTYPE html>
<html lang="en">
<html>
<head>
<title>Test</title>
<script src="http://code.jquery.com/jquery-3.1.1.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(doReady);
function doReady()
{
jQuery('#checkAll')
.on("click",
function (event) {
var $that = null;
event.preventDefault();
jQuery.each(jQuery(".selectRow"),
function (index, value) {
$that = jQuery(value);
if (!$that.is(':checked') && !$that.is(":disabled")) {
jQuery(this).attr("checked", "checked");
}
}
);
}
);
}
</script>
</head>
<body>
<button id="checkAll" name="checkAll">check</button>
<input type="checkbox" class="selectRow" />
<input type="checkbox" class="selectRow" />
<input type="checkbox" class="selectRow" />
<input type="checkbox" class="selectRow" />
<input type="checkbox" class="selectRow" />
<input type="checkbox" class="selectRow" disabled="disabled" />
</body>
</html>
Note that it is better to assign the same jQuery selector to a variable in order to avoid getting a 2nd time over the whole DOM tree.
And also note that you missed out a curly brace on your code example.
链接地址: http://www.djcxy.com/p/71044.html