Home >Web Front-end >JS Tutorial >Based on jQuery to implement the check box selection all, unselect all and inverse selection functions
This code is selected from many jQuery check box function codes. The code used in my project is shared with everyone here.
jQuery code:
$(function(){ $("#checkedAll").click(function(){ $('[name=items]:checkbox').attr('checked',true); }); $("#checkedNo").click(function(){ $('[name=items]:checkbox').attr('checked',false); }); $("#checkedRev").click(function(){ $('[name=items]:checkbox').each(function(){ //$(this).attr('checked',!$(this).attr('checked')); this.checked = !this.checked; }); }); $("#send").click(function(){ var str = "你选中的是:\r\n"; $('[name=items]:checkbox:checked').each(function(){ str += $(this).val()+"\r\n"; }); alert(str); }); });
HTML code:
你爱好的运动是?<br> <input type="checkbox" name="items" value="足球"/>足球 <input type="checkbox" name="items" value="篮球"/>篮球 <input type="checkbox" name="items" value="羽毛球"/>羽毛球 <input type="checkbox" name="items" value="乒乓球"/>乒乓球<br> <input type="button" id="checkedAll" value="全 选"/> <input type="button" id="checkedNo" value="全不选"/> <input type="button" id="checkedRev" value="反 选"/> <input type="button" id="send" value="提 交"/>
Guys, is it very convenient to use? This is what I selected from thousands of people. I hope it can be useful to everyone. Helps.
For more articles based on jQuery to implement checkbox selection, all selection, and inverse selection function, please pay attention to the PHP Chinese website!