jQuery - 操作复选框checkbox(判断是否选中、设置勾选状态)
注意:使用prop()方法,而不要使用attr()方法。
像 checkbox,radio 和 select 这样的元素,选中属性对应“checked”和“selected”。这些属于 HTML 元素固有属性,因此需要使用 prop 方法去操作才能获得正确的结果。如果使用 attr 的话,会发现其选中状态并不会按我们想象的一样变化。
像 checkbox,radio 和 select 这样的元素,选中属性对应“checked”和“selected”。这些属于 HTML 元素固有属性,因此需要使用 prop 方法去操作才能获得正确的结果。如果使用 attr 的话,会发现其选中状态并不会按我们想象的一样变化。
1,判断是否勾选
下面样例中,按钮点击后会弹出 checkbox 的勾选状态(是否选中)。
<html> <head> <title>hangge.com</title> <meta charset="utf-8"/> <script type="text/javascript" src="jquery-1.11.1.min.js"></script> <script> function btnClick() { var isChecked = $('#checkbox1').prop('checked'); alert(isChecked); } </script> </head> <body> <input id="checkbox1" type="checkbox" value="101"/> <label for="checkbox1">复选框1</label> <br><br> <button type="button" onclick="btnClick()">获取checkbox选中状态</button> </body> </html>
$('#checkbox1').prop('checked', true);
3,取消勾选
$('#checkbox1').prop('checked', false);