如何使用 jQuery 检查复选框是否被选中
答案:使用jQuery prop() 方法 & :checked 选择器
以下部分描述了如何使用 jQuery prop() 方法以及 :checked 选择器来跟踪复选框的状态，无论它是否被选中。
使用 jQuery prop() 方法
jQuery prop() 方法提供了一种简单、有效且可靠的方法来跟踪复选框的当前状态。 它在所有条件下都工作得很好，因为每个复选框都有一个选中的属性，它指定了它的选中或未选中状态。
不要用 checked 属性误解它。 checked 属性只定义复选框的初始状态，而不是当前状态。 让我们看看它是如何工作的:
示例
<script>
$(document).ready(function(){
$('input[type="checkbox"]').click(function(){
if($(this).prop("checked") == true){
console.log("Checkbox is checked.");
}
else if($(this).prop("checked") == false){
console.log("Checkbox is unchecked.");
}
});
});
</script>使用 jQuery :checked 选择器
您还可以使用 jQuery :checked 选择器来检查复选框的状态。 :checked 选择器专为单选按钮和复选框而设计。
让我们看一下以下示例，以了解其基本工作原理:
示例
<script>
$(document).ready(function(){
$('input[type="checkbox"]').click(function(){
if($(this).is(":checked")){
console.log("Checkbox is checked.");
}
else if($(this).is(":not(:checked)")){
console.log("Checkbox is unchecked.");
}
});
});
</script>FAQ 相关问题解答
以下是与此主题相关的更多常见问题解答:
- 如何使用 jQuery 获取组中选定复选框的值
- 如何使用 jQuery 动态选中或取消选中复选框
- 根据 jQuery 中单选按钮的选择显示和隐藏 DIV 元素
- 在 jQuery 中基于复选框的点击显示和隐藏 DIV 元素
