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 相关文章推荐
jQuery中:enabled选择器用法实例
Jan 04 Javascript
跟我学习javascript的隐式强制转换
Nov 16 Javascript
JavaScript中iframe实现局部刷新的几种方法汇总
Jan 06 Javascript
jquery弹出框插件jquery.ui.dialog用法分析
Aug 20 Javascript
JS判断鼠标进入容器的方向与window.open新窗口被拦截的问题
Dec 23 Javascript
浅谈 Vue v-model指令的实现原理
Jun 08 Javascript
Vue.js如何实现路由懒加载浅析
Aug 14 Javascript
解决vue v-for 遍历循环时key值报错的问题
Sep 06 Javascript
详解js实时获取并显示当前时间的方法
May 10 Javascript
js神秘的电报密码 哈弗曼编码实现
Sep 10 Javascript
jQuery单页面文字搜索插件jquery.fullsearch.js的使用方法
Feb 04 jQuery
vue如何清除浏览器历史栈
May 25 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
检查php文件中是否含有bom的函数
2012/05/31 PHP
PHP中redis的用法深入解析
2014/02/20 PHP
php使用正则过滤js脚本代码实例
2014/05/10 PHP
PHP实现绘制3D扇形统计图及图片缩放实例
2014/10/01 PHP
php+xml结合Ajax实现点赞功能完整实例
2015/01/30 PHP
PHP微信开发之文本自动回复
2016/06/23 PHP
Laravel 前端资源配置教程
2019/10/18 PHP
如何用js控制css中的float的代码
2007/08/16 Javascript
DLL+ ActiveX控件+WEB页面调用例子
2010/08/07 Javascript
一个页面放2段图片滚动代码出现冲突的问题如何解决
2012/12/21 Javascript
innerText和textContent对比及使用介绍
2013/02/27 Javascript
阻止子元素继承父元素事件具体思路及实现
2013/05/02 Javascript
jquery+css3打造一款ajax分页插件(自写)
2014/06/18 Javascript
在Ubuntu上安装最新版本的Node.js
2014/07/14 Javascript
JS实现一个按钮的方法
2015/02/05 Javascript
JavaScript模拟深蓝vs卡斯帕罗夫的国际象棋对局示例
2015/04/22 Javascript
vue bootstrap小例子一枚
2017/06/09 Javascript
微信公众号平台接口开发 获取微信服务器IP地址方法解析
2019/08/14 Javascript
Vue循环中多个input绑定指定v-model实例
2020/08/31 Javascript
Vue中使用wangeditor富文本编辑的问题
2021/02/07 Vue.js
pandas 条件搜索返回列表的方法
2018/10/30 Python
python实现图书借阅系统
2019/02/20 Python
Python第三方库face_recognition在windows上的安装过程
2019/05/03 Python
Python中turtle库的使用实例
2019/09/09 Python
HTML5手机端弹出遮罩菜单特效代码
2016/01/27 HTML / CSS
俄罗斯美容和健康网上商店:Созвездие Красоты
2019/07/23 全球购物
NYX Professional Makeup俄罗斯官网:世界知名的化妆品品牌
2019/12/26 全球购物
城市轨道交通工程职业规划书范文
2014/01/18 职场文书
教师廉洁自律承诺书
2014/05/26 职场文书
投标邀请书范本
2015/02/02 职场文书
民主评议党员个人总结
2015/02/13 职场文书
2015年实习班主任工作总结
2015/04/23 职场文书
股东大会通知
2015/04/24 职场文书
2015年党风廉政建设目标责任书
2015/05/08 职场文书
公司员工宿舍管理制度
2015/08/03 职场文书
放飞理想主题班会
2015/08/14 职场文书