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 面向对象编程  function是方法(函数)
Sep 17 Javascript
jQuery 源码分析笔记(4) Ready函数
Jun 02 Javascript
用js获取电脑信息(是使用与IE浏览器)
Jan 15 Javascript
js onmousewheel事件多次触发问题解决方法
Oct 17 Javascript
JS组件Bootstrap Table表格行拖拽效果实现代码
Aug 27 Javascript
jQuery实现简单隔行变色的方法
Feb 20 Javascript
js监听input输入框值的实时变化实例
Jan 26 Javascript
JavaScript实现为事件句柄绑定监听函数的方法分析
Nov 14 Javascript
angular1配合gulp和bower的使用教程
Jan 19 Javascript
vue awesome swiper异步加载数据出现的bug问题
Jul 03 Javascript
小程序如何在不同设备上自适应生成海报的实现方法
Aug 20 Javascript
js实现烟花特效
Mar 02 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+MySQL搭建聊天室功能实例代码
2012/08/20 PHP
浅谈laravel-admin form中的数据,在提交后,保存前,获取并进行编辑
2019/10/21 PHP
某人初学javascript的时候写的学习笔记
2010/12/30 Javascript
JQuery之拖拽插件实现代码
2011/04/14 Javascript
JS实现商品倒计时实现代码
2013/05/03 Javascript
node.js中的fs.writeFileSync方法使用说明
2014/12/14 Javascript
实例讲解jquery中mouseleave和mouseout的区别
2016/02/17 Javascript
nodejs入门教程一:概念与用法简介
2017/04/24 NodeJs
js HTML5 canvas绘制图片的方法
2017/09/08 Javascript
Vue 开发音乐播放器之歌手页右侧快速入口功能
2018/08/08 Javascript
vue、react等单页面项目部署到服务器的方法及vue和react的区别
2018/09/29 Javascript
vue 项目 iOS WKWebView 加载
2019/04/17 Javascript
jQuery实现动态生成年月日级联下拉列表示例
2019/05/11 jQuery
vux-scroller实现移动端上拉加载功能过程解析
2019/10/08 Javascript
Vue通过getAction的finally来最大程度避免影响主数据呈现问题
2020/04/24 Javascript
[01:57]DOTA2上海特锦赛小组赛解说单车采访花絮
2016/02/27 DOTA
Python的Flask框架中实现登录用户的个人资料和头像的教程
2015/04/20 Python
Python函数中*args和**kwargs来传递变长参数的用法
2016/01/26 Python
在python中实现强制关闭线程的示例
2019/01/22 Python
python代码实现逻辑回归logistic原理
2019/08/07 Python
python pygame实现滚动横版射击游戏城市之战
2019/11/25 Python
HTML5录音实践总结(Preact)
2020/05/07 HTML / CSS
巴西24小时在线药房:Droga Raia
2020/05/12 全球购物
阿联酋最好的手机、电子产品和家用电器网上商店:Eros Digital Home
2020/08/09 全球购物
remote接口和home接口主要作用
2013/05/15 面试题
质检部岗位职责
2013/11/11 职场文书
村干部培训方案
2014/05/02 职场文书
技术负责人任命书
2014/06/05 职场文书
党的群众路线教育实践活动教师自我剖析材料
2014/10/09 职场文书
收银员岗位职责范本
2015/04/07 职场文书
幼儿园辞职信
2015/05/13 职场文书
保护环境建议书作文500字
2015/09/14 职场文书
2019年让高校“心动”的自荐信
2019/03/25 职场文书
会计专业自荐信范文
2019/05/22 职场文书
详解Python为什么不用设计模式
2021/06/24 Python
Centos系统通过Docker安装并搭建MongoDB数据库
2022/04/12 MongoDB