jquery处理checkbox(复选框)是否被选中实例代码
jquery处理checkbox(复选框)是否被选中
现在如果一个复选框被选中,是用checked=true,checked="checked"也行
要用prop代替attr会更好,虽然在jQuery1.6之前版本的attr()方法能正常使用,但是现在必须使用prop()方法代替
实例代码:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"/> <title>checkbox</title> </head> <body> <input type="button" id="btn1" value="全选"> <input type="button" id="btn2" value="取消全选"> <input type="button" id="btn3" value="选中所有奇数"> <input type="button" id="btn4" value="反选"> <input type="button" id="btn5" value="获得选中的所有值"> <input type="checkbox" value="checkbox1"/> <input type="checkbox" value="checkbox2"/> <input type="checkbox" value="checkbox3"/> <input type="checkbox" value="checkbox4"/> <input type="checkbox" value="checkbox5"/> <script src="js/jquery-3.2.0.min.js"></script> <script> $(function(){ var checkbox = $("input[type=checkbox]"); $("#btn1").on("click",function(){ checkbox.prop("checked",true); }); $("#btn2").on("click",function(){ checkbox.prop("checked",false); }); $("#btn3").on("click",function(){ $("input[type=checkbox]:even").prop("checked",true); }); $("#btn4").on("click",function(){ checkbox.each(function(){ if($(this).prop("checked")){ $(this).prop("checked",false); }else{ $(this).prop("checked",true); } }); }); $("#btn5").on("click",function(){ var str = ""; $("input[type=checkbox]").each(function(){ if($(this).prop("checked")){ str += $(this).val() + ","; } }); console.log(str); }); }); </script> </body> </html>
感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!
相关推荐
haocxy 2020-06-09
hehekai 2020-05-08
ELEMENTS爱乐小超 2020-04-23
sixthelement 2020-04-09
lianback 2020-03-28
天步 2020-01-21
81463166 2020-01-04
waterv 2019-12-08
peixiaopao 2011-08-14
88580793 2018-01-03
89387046 2017-11-08
taiyangyu 2019-09-04
herionliu 2019-09-05
83296631 2017-09-30
ddzhouqian 2015-05-06
VipWangQiaoqiao 2013-06-05