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 相关文章推荐
javascript 自动填写表单的实现方法
Apr 09 Javascript
js关于精确计算和数值格式化以及直接引js文件
Jan 28 Javascript
在JavaScript的AngularJS库中进行单元测试的方法
Jun 23 Javascript
angularjs 表单密码验证自定义指令实现代码
Oct 27 Javascript
详解node-ccap模块生成captcha验证码
Jul 01 Javascript
基于input框覆盖掉数字英文的实例讲解
Jul 21 Javascript
vue 源码解析之虚拟Dom-render
Aug 26 Javascript
Vue 动态路由的实现及 Springsecurity 按钮级别的权限控制
Sep 05 Javascript
SSM+layUI 根据登录信息显示不同的页面方法
Sep 20 Javascript
微信小程序工具函数封装
Oct 28 Javascript
jQuery实现查看图片功能
Dec 01 jQuery
Vue.js 带下拉选项的输入框(Textbox with Dropdown)组件
Apr 17 Vue.js
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
全国FM电台频率大全 - 2 天津市
2020/03/11 无线电
php中bind_param()函数用法分析
2017/03/28 PHP
YII2框架中查询生成器Query()的使用方法示例
2020/03/18 PHP
JavaScript写的一个DIV 弹出网页对话框
2009/08/14 Javascript
打印json对象的内容及JSON.stringify函数应用
2013/03/29 Javascript
JavaScript实现复制功能各浏览器支持情况实测
2013/07/18 Javascript
js对象转json数组的简单实现案例
2014/02/28 Javascript
JS实现响应鼠标点击动画渐变弹出层效果代码
2016/03/25 Javascript
关于前后端json数据的发送与接收详解
2017/07/30 Javascript
一步步教你利用Canvas对图片进行处理
2017/09/19 Javascript
一次记住JavaScript的6个正则表达式方法
2018/02/22 Javascript
解决webpack无法通过IP地址访问localhost的问题
2018/02/22 Javascript
7个好用的JavaScript技巧分享(译)
2019/05/07 Javascript
Vue.js 无限滚动列表性能优化方案
2019/12/02 Javascript
解决element-ui的下拉框有值却无法选中的情况
2020/11/07 Javascript
原生JavaScript实现随机点名表
2021/01/14 Javascript
Python日期操作学习笔记
2008/10/07 Python
Python转换HTML到Text纯文本的方法
2015/01/15 Python
Python图像灰度变换及图像数组操作
2016/01/27 Python
Django基础三之视图函数的使用方法
2019/07/18 Python
python创建属于自己的单词词库 便于背单词
2019/07/30 Python
Pycharm及python安装详细步骤及PyCharm配置整理(推荐)
2020/07/31 Python
python 爬虫爬取京东ps4售卖情况
2020/12/18 Python
CHARLES & KEITH台湾官网:新加坡时尚品牌
2019/07/30 全球购物
Pureology官网:为染色头发打造最好的产品
2019/09/13 全球购物
德国的各种媒体在线商店:Thalia.de(书籍、电子书、玩具等)
2020/10/08 全球购物
营业经理岗位职责
2013/11/10 职场文书
室内设计专业学生的自我评价分享
2013/11/27 职场文书
公务员更新知识培训实施方案
2014/03/31 职场文书
大学生考试作弊检讨书
2014/09/21 职场文书
社保转移委托书范本
2014/10/08 职场文书
煤矿安全保证书
2015/02/27 职场文书
校园广播稿范文
2015/08/19 职场文书
反邪教学习心得体会
2016/01/15 职场文书
SONY AN-LP1 短波有源天线放大器图
2022/04/05 无线电
MySQL运行报错:“Expression #1 of SELECT list is not in GROUP BY clause and contains nonaggre”解决方法
2022/06/14 MySQL