jQuery判断复选框是否被选中的3种方式
页面部分:
<input type="checkbox" id="cbx" /><label for="cbx">点我</label><br/>
<input type="button" id="btn" value="获取复选框的值"/>
□ 方法一: attr('checked')返回undefined,不推荐使用
1: <script type="text/javascript">
2: $(function() {
3: $('#btn').click(function() {
4: var isChecked = $('#cbx').attr('checked');
5: alert(isChecked);
6: });
7: });
8: </script>
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
无论是否勾选,都返回undefined:
□ 方法二:prop('checked')返回true或false,可使用
1: $(function() {
2: $('#btn').click(function() {
3: var isChecked = $('#cbx').prop('checked');
4: alert(isChecked);
5: });
6: });
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
勾选,返回true:
不勾选,返回false:
□ 方法三:is(':checked')返回true或false,可使用
1: $(function() {
2: $('#btn').click(function() {
3: var isChecked = $('#cbx').is(':checked');
4: alert(isChecked);
5: });
6: });
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
效果同方法二。
□ 遍历所有勾选复选框
$('input[type='checkbox']:checked').each(function(){
//TODO:
});
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
jQuery判断复选框是否被选中的3种方式的更多相关文章
- jQuery判断复选框checkbox的选中状态
通过jQuery设置复选框为选中状态 复选框 <input type="checkbox"/> 错误代码: $("input").attr(&quo ...
- [jQuery] 判断复选框checkbox是否选中checked
返回值是true/false method 1: $("#register").click(function(){ if($("#accept").get(0) ...
- jquery判断复选框是否被选中
$("#isUse").click(function(){ if($(this).is(':checked')){ $(this).attr('checked','checked' ...
- jquery判断复选框是否选中
jquery判断复选框是否被选中 $(function(){ $(document).on("click", ".checkbox",function(){ v ...
- jquery判断复选框checkbox是否被选中
jquery判断复选框checkbox是否被选中 使用is方法 //如果选中返回true //如果未选中返回false .is(':checked');
- jQuery判断复选框是否勾选
一个功能复选框勾选时给input表单赋值,复选框取消时将表单值清除. 功能:复选框勾选时给input表单赋值,复选框取消时将表单值清除. 实现源码:cyfID为复选框的id $("#cyfI ...
- 【WEB】jQuery 判断复选框是否选中
1.背景 在 jQuery 1.6 版本之前,判断方式 <input type='checkbox' id='test'/> <script> var isChecked = ...
- IE7下如何判断复选框是否被选中(利用jquery)
var checkM; $(".rate-mainL .checkM").click(function(){ var checkM=$("input[name='chec ...
- jQuery检测判断复选框是否被选中了的几种方法
方法一:if ($("#checkbox-id")get(0).checked) { // do something} 方法二:if($('#checkbox-id').is ...
随机推荐
- Tango ROS Streamer
谁想要在Android平台上编写机器人应用,或者谁希望扩展其与室内定位和3D感知新的传感器的机器人开发,Intermodalics创建的ROS Streamer应用的Tango. 这个Android应 ...
- 在EC2上创建root用户,并使用root用户登录
今天开始研究亚马逊的云主机EC2,遇到了一个问题,我需要在EC2上安装tomcat,但是yum命令只能是root用户才可以运行,而EC2默认是以ec2-user用户登录的,所以需要切换到root用户登 ...
- 一键复制功能 - Vue
经常遇到一键复制功能,简单记录一下.这里使用的是clipboard插件:https://clipboardjs.com/ 第一步 安装:npm install clipboard --save 第二步 ...
- 2017冬季24集训模拟题-24星球的末日(Floyd)
24 星球的末日[问题描述]24 星球的世界末日就要到了 , 可是诺亚方舟还没有制造完成 . 为了制造诺亚方舟这个星球上的所有国家都站在统一战线 . 现在一共有n个国家 , 一个国家到另一个国家都有一 ...
- HTTP Status 500 - Request processing failed; nested exception is org.apache.ibatis.binding.BindingException
在使用Maven工程管理工具整合SSM框架时,Mybatis使用逆向工程生成的pojo,mapper接口及映射文件,把mapper接口和映射文件放在DAO工程的同一级src/main/java目录下. ...
- shell心得
向loader.ctl中插入文本
- java.lang.ClassNotFoundException: net.sf.ezmorph.Morpher
java.lang.ClassNotFoundException: net.sf.ezmorph.Morpher 出现以上异常,可能是使用Json缺少ezmorph包: 以下是Json常用的包:ezm ...
- 标准c库函数与Linux下系统函数库 区别 (即带不带缓冲区的学习)
我们都知道,C语言在UNIX/Linux系统下有一套系统调用(系统函数),比如文件操作open().close().write().read()等,而标准C语言的库函数中也有一套对文件的操作函数fop ...
- python2和python3同时安装
现在很多项目用python2完成的,很多情况下2和3是同时存在的 大多人都是先安装了python2 安装python3: 下一步: 然后安装完成以后,去cmd控制台输入python看看安装成功了吗(用 ...
- 阿里云无法远程连接数据库MySQL错误码10060解决办法
使用图形界面管理工具Navicat for MySQL连接Mysql数据库时提示错误:Can't connect to MySQL server (10060) 导致些问题可能有以下几个原因: 1.网 ...