jquery如何判断checkbox（复选框）是否被选中
都知道 在html 如果一个复选框被选中 是 checked="checked"。
但是我们如果用jquery alert($("#id").attr("checked")) 会提示您是true而不是checked
所以很多朋友判断 if($("#id").attr("checked")=="true") 这个是错误的，其实应该是 if($("#id").attr("checked")==true)
例子里面包括了一下几个功能。
<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="获得选中的所有值">
代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<SCRIPT LANGUAGE="JavaScript" src="http://www.cnjquery.com/demo/jquery.js"></script>
<SCRIPT LANGUAGE="JavaScript">
<!--
$("document").ready(function(){
$("#btn1").click(function(){
$("[name='checkbox']").attr("checked",'true');//全选
})
$("#btn2").click(function(){
$("[name='checkbox']").removeAttr("checked");//取消全选
})
$("#btn3").click(function(){
$("[name='checkbox']:even").attr("checked",'true');//选中所有奇数
})
$("#btn4").click(function(){
$("[name='checkbox']").each(function(){
if($(this).attr("checked"))
{
$(this).removeAttr("checked");
}
else
{
$(this).attr("checked",'true');
}
})
})
$("#btn5").click(function(){
var str="";
$("[name='checkbox'][checked]").each(function(){
str+=$(this).val()+""r"n";
//alert($(this).val());
})
alert(str);
})
})
//-->
</SCRIPT>
</HEAD>
<BODY>
<form name="form1" method="post" action="">
<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="获得选中的所有值">
<br>
<input type="checkbox" name="checkbox" value="checkbox1">
checkbox1
<input type="checkbox" name="checkbox" value="checkbox2">
checkbox2
<input type="checkbox" name="checkbox" value="checkbox3">
checkbox3
<input type="checkbox" name="checkbox" value="checkbox4">
checkbox4
<input type="checkbox" name="checkbox" value="checkbox5">
checkbox5
<input type="checkbox" name="checkbox" value="checkbox6">
checkbox6
<input type="checkbox" name="checkbox" value="checkbox7">
checkbox7
<input type="checkbox" name="checkbox" value="checkbox8">
checkbox8
</form>
分享到：
相关推荐
在探讨如何使用jQuery判断复选框(checkbox)是否被选中的过程中，我们首先需要理解复选框的基本属性以及jQuery操作DOM元素的方式。复选框在HTML中被定义为`<input type="checkbox">`，当它被选中时，其`checked`属性...
标题提到的“jquery判断复选框是否被全部选中，达到全选的目的”，就是针对这一需求的具体实现。下面我们将详细探讨如何利用jQuery来完成这个功能。 首先，我们需要理解jQuery库的基本用法。jQuery是一个广泛使用的...
jquery 判断复选框是否选中以及如何选中的问题做一下总结。 进入正题，还是当页面有如下一组复选框的时候： <input type=checkbox name=fruit value=apple />苹果 <input type=checkbox name=fruit value...
JQuery 判断checkbox是否选中，checkbox全选，获取checkbox选中值
1. **jQuery判断复选框是否被选中** 在jQuery中，可以使用`.attr()`方法检查复选框的`checked`属性来判断其是否被选中。例如，如果你有一个复选框的ID为"id"，你可以这样判断： ```javascript if ($("#id").attr...
通过上述内容的介绍，我们可以了解到使用jQuery判断复选框是否被选中，并根据用户的答题情况给出相应的提示是一种简单有效的方法。掌握这些知识点不仅能够帮助开发者提升交互设计的合理性，还可以增强用户对网站或...
在Web开发过程中，经常会遇到需要处理表单输入元素的情况。...以上就是使用jQuery判断复选框是否选中的三种方法的详细说明。在实际开发中，建议根据具体场景选择最合适的方法，以保持代码的清晰和效率。
而在使用jQuery进行DOM操作时，获取这些复选框的状态（是否被选中）、统计被选中的数量以及获取具体的选中值是常见的需求。 首先，获取复选框被选中数量可以通过使用jQuery的属性选择器和内置属性进行。如示例代码...
4. **条件判断**：正确判断复选框是否被选中的方式是 `if ($("#id").attr("checked")==true)`，而不是 `if ($("#id").attr("checked")=="true")`。因为JavaScript会将`"checked"`字符串转换为布尔值`true`，所以比较...
本篇将详细介绍如何在Bootstrap Table中实现复选框的默认选中功能，特别地，我们将根据从数据库获取的状态来决定复选框是否被选中。 首先，我们需要引入Bootstrap Table的相关库，包括CSS和JavaScript文件。这些...
如果你的复选框是按行排列的，例如在一个表格中，你可以通过索引来判断是否选中。假设复选框紧跟在tr元素后面： ```javascript $('#selectOddRows').click(function() { $('table tr:odd input[type="checkbox"]...
`$(this).is(':checked')`用于判断全选复选框是否被选中，`$('.child-checkbox').prop('checked', true/false)`则是用来改变所有子复选框的选中状态。 此外，为了完善用户体验，我们还可以添加一个反向操作，即当...
对于复选框，我们可以用它来获取`checked`属性，判断复选框是否被选中。 ```javascript // 检查复选框是否被选中 var isChecked = $('input[type="checkbox"]').prop('checked'); ``` 2. `.val()`方法：当复选框的...
在这个实例中，我们主要关注如何使用 jQuery 来判断复选框（checkbox）是否被选中，并根据用户的答题情况进行提示。 首先，我们需要了解复选框在HTML中的基本结构。在示例中，我们有四个复选框，每个代表一个选项...
在处理用户交互时，我们经常需要判断复选框是否被选中。本篇将详细介绍两种判断复选框状态的方法，这些方法在实际项目中得到了验证，非常适合开发者学习和应用。 ### 方法一：通过DOM属性检查 在JavaScript中，...