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对象数组的OrderByAsc和OrderByDesc方法实现思路
May 17 Javascript
你可能不知道的JavaScript的new Function()方法
Apr 17 Javascript
JS应用正则表达式转换大小写示例
Sep 18 Javascript
js中for in语句的用法讲解
Apr 24 Javascript
javascript随机显示背景图片的方法
Jun 18 Javascript
js鼠标按键事件和键盘按键事件用法实例汇总
Oct 03 Javascript
javascript连接mysql与php通过odbc连接任意数据库的实例
Dec 27 Javascript
关于Webpack dev server热加载失败的解决方法
Feb 22 Javascript
vue中的inject学习教程
Apr 24 Javascript
在layui中对table中的数据进行判断(0、1)转换为提示信息的方法
Sep 28 Javascript
vue  elementUI 表单嵌套验证的实例代码
Nov 06 Javascript
JS实现纵向轮播图(初级版)
Jan 18 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输入流php://input使用浅析
2014/09/02 PHP
php获取用户浏览器版本的方法
2015/01/03 PHP
php使用ftp远程上传文件类(完美解决主从文件同步问题的方法)
2016/09/23 PHP
jQuery select的操作实现代码
2009/05/06 Javascript
javascript重复绑定事件造成的后果说明
2013/03/02 Javascript
JSONP获取Twitter和Facebook文章数的具体步骤
2014/02/24 Javascript
JavaScript编程的10个实用小技巧
2014/04/18 Javascript
javascript常用方法汇总
2014/12/02 Javascript
纯JS代码实现隔行变色鼠标移入高亮
2016/11/23 Javascript
SVG描边动画
2017/02/23 Javascript
JS实现简单的天数计算器完整实例
2017/04/28 Javascript
解决在Bootstrap模糊框中使用WebUploader的问题
2018/03/22 Javascript
JavaScript类的继承操作实例总结
2018/12/20 Javascript
JavaScript实现汉字转换为拼音及缩写的方法示例
2019/03/28 Javascript
下载糗事百科的内容_python版
2008/12/07 Python
详细解析Python当中的数据类型和变量
2015/04/25 Python
简单上手Python中装饰器的使用
2015/07/12 Python
Django框架下在URLconf中指定视图缓存的方法
2015/07/23 Python
Django入门使用示例
2017/12/12 Python
python实现简单tftp(基于udp协议)
2018/07/30 Python
python语音识别实践之百度语音API
2018/08/30 Python
总结python中pass的作用
2019/02/27 Python
Python中捕获键盘的方式详解
2019/03/28 Python
python获取引用对象的个数方式
2019/12/20 Python
Python正则re模块使用步骤及原理解析
2020/08/18 Python
python脚本使用阿里云slb对恶意攻击进行封堵的实现
2021/02/04 Python
css3动画效果小结(推荐)
2016/07/25 HTML / CSS
Ajax的优点和缺点
2014/11/21 面试题
社区中秋节活动方案
2014/01/29 职场文书
文秘专业应届生求职信
2014/05/26 职场文书
2014年客户经理工作总结
2014/11/20 职场文书
婚礼女方父母答谢词
2015/01/04 职场文书
前台岗位职责
2015/02/13 职场文书
初中教师德育工作总结2015
2015/05/12 职场文书
《西门豹》教学反思
2016/02/23 职场文书
详解OpenCV获取高动态范围(HDR)成像
2022/04/29 Python