jquery判断checkbox(复选框)是否被选中的代码


Posted in Javascript onOctober 20, 2010
//是否被选中验证有选中的return true,否return false 
function mycheckbox() { 
var falg = 0; 
$("input[name='soft[]']:checkbox").each(function () { 
if ($(this).attr("checked")) { 
falg += 1; 
} 
}) 
if (falg > 0) 
return true; 
else 
return false; 
}

这是一个比较不错的方法,收藏了。
下面这个函数是对上面的补充:
本来就是这种写法啊。jq1.42的写法。 
其次,建议你的逻辑处理 
function mycheckbox() { 
var falg = 0; 
$("input[name='soft[]']:checkbox").each(function () { 
if ($(this).attr("checked")) { 
falg =1; 
return false; 
} 
}) 
if (falg > 0) 
return true; 
else 
return false; 
}

下面是简单的判断
jquery核心判断语句判断语句

if($('input:checkbox').attr("checked")==true)

谁都知道 在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>
/************单个checkbox全选************************/ 
function clickCheckbox() { 
if($("#checkPathAll").attr("checked")) 
{ 
$("input[name='checkPath']").each(function() { 
$(this).attr("checked", true); 
}); 
} 
else 
{ 
$("input[name='checkPath']").each(function() { 
$(this).attr("checked", false); 
}); 
} 
}
Javascript 相关文章推荐
js 第二代身份证号码的验证机制代码
May 12 Javascript
jQuery动态修改超链接地址的方法
Feb 13 Javascript
JavaScript数组实现数据结构中的队列与堆栈
May 26 Javascript
jQuery选择器特殊字符与属性空格问题
Aug 14 jQuery
详解vue axios中文文档
Sep 12 Javascript
VUE中v-on:click事件中获取当前dom元素的代码
Aug 22 Javascript
解决vue select当前value没有更新到vue对象属性的问题
Aug 30 Javascript
react 父子组件之间通讯props
Sep 08 Javascript
vue+Vue Router多级侧导航切换路由(页面)的实现代码
Dec 20 Javascript
说说如何利用 Node.js 代理解决跨域问题
Apr 22 Javascript
JS块级作用域和私有变量实例分析
May 11 Javascript
element-ui 本地化使用教程详解
Oct 28 Javascript
jQuery下扩展插件和拓展函数的写法(匿名函数使用的典型例子)
Oct 20 #Javascript
JQuery 拾色器插件发布-jquery.icolor.js
Oct 20 #Javascript
Javascript技巧之不要用for in语句对数组进行遍历
Oct 20 #Javascript
来自国外的14个图片放大编辑的jQuery插件整理
Oct 20 #Javascript
理解Javascript_12_执行模型浅析
Oct 18 #Javascript
理解Javascript_11_constructor实现原理
Oct 18 #Javascript
关于js中window.location.href,location.href,parent.location.href,top.location.href的用法与区别
Oct 18 #Javascript
You might like
PHP安装攻略:常见问题解答(二)
2006/10/09 PHP
一个基于PDO的数据库操作类
2011/03/24 PHP
php页面缓存ob系列函数介绍
2012/10/18 PHP
php5.4以下版本json不支持不转义内容中文的解决方法
2015/01/13 PHP
Yii框架核心组件类实例详解
2019/08/06 PHP
js技巧--转义符&quot;\&quot;的妙用
2007/01/09 Javascript
IE与Firefox下javascript getyear年份的兼容性写法
2007/12/20 Javascript
JavaScript阻止浏览器返回按钮的方法
2015/03/18 Javascript
Javascript函数式编程语言
2015/10/11 Javascript
BootStrap中
2016/12/10 Javascript
Angular 常用指令实例总结整理
2016/12/13 Javascript
Javascript继承机制详解
2017/05/30 Javascript
jstree单选功能的实现方法
2017/06/07 Javascript
vue项目中引入noVNC远程桌面的方法
2018/03/05 Javascript
在AngularJs中设置请求头信息(headers)的方法及不同方法的比较
2018/09/04 Javascript
vue Tab切换以及缓存页面处理的几种方式
2019/11/05 Javascript
Vue使用虚拟dom进行渲染view的方法
2019/12/26 Javascript
解决nuxt页面中mounted、created、watch执行两遍的问题
2020/11/05 Javascript
在Mac OS上部署Nginx和FastCGI以及Flask框架的教程
2015/05/02 Python
Python中规范定义命名空间的一些建议
2016/06/04 Python
放弃 Python 转向 Go语言有人给出了 9 大理由
2017/10/20 Python
python opencv检测目标颜色的实例讲解
2018/04/02 Python
Python 调用 ES、Solr、Phoenix的示例代码
2020/11/23 Python
一家专门做特卖的网站:唯品会
2016/10/09 全球购物
马来西亚最好的婴儿商店:Motherhood
2017/09/14 全球购物
巴西婴儿用品商店:Bebe Store
2017/11/23 全球购物
百思买加拿大:Best Buy Canada
2018/03/20 全球购物
关于.NET, HTML的五个问题
2012/08/29 面试题
校园招聘策划书
2014/01/09 职场文书
模具数控专业自荐信
2014/01/27 职场文书
迎八一活动主题
2014/01/31 职场文书
个人简历中自我评价
2014/02/11 职场文书
电脑售后服务承诺书
2014/03/27 职场文书
优质服务演讲稿
2014/05/14 职场文书
环保宣传语大全
2015/07/13 职场文书
《自然之道》读后感3篇
2019/12/17 职场文书