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 相关文章推荐
返回对象在当前级别中是第几个元素的实现代码
Jan 20 Javascript
jQuery处理xml格式的返回数据(实例解析)
Nov 28 Javascript
兼容所有浏览器的js复制插件Zero使用介绍
Mar 19 Javascript
JS实现鼠标箭头变成一个燃烧烛光效果的方法
Feb 28 Javascript
node.js + socket.io 实现点对点随机匹配聊天
Jun 30 Javascript
vue项目中用cdn优化的方法
Jan 03 Javascript
jQuery轮播图实例详解
Aug 15 jQuery
JavaScript对JSON数组简单排序操作示例
Jan 31 Javascript
微信小程序自定义多列选择器使用详解
Jun 21 Javascript
小程序实现横向滑动日历效果
Oct 21 Javascript
使用Angular9和TypeScript开发RPG游戏的方法
Mar 25 Javascript
JS如何实现基于websocket的多端桥接平台
May 14 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截取字符串并保留完整xml标签的函数代码
2013/02/06 PHP
解析php函数method_exists()与is_callable()的区别
2013/06/21 PHP
PHP中source #N问题的解决方法
2014/01/27 PHP
php控制文件下载速度的方法
2015/03/24 PHP
php给图片添加文字水印方法汇总
2015/08/27 PHP
Symfony的安装和配置方法
2016/03/17 PHP
为Yahoo! UI Extensions Grid增加内置的可编辑器
2007/03/10 Javascript
JS 文件大小判断的实现代码
2010/04/07 Javascript
比Jquery的document.ready更快的方法
2010/04/28 Javascript
JS实现简单的Canvas画图实例
2013/07/04 Javascript
javascript中负数算术右移、逻辑右移的奥秘探索
2013/10/17 Javascript
jquery中$each()方法的使用指南
2015/04/30 Javascript
微信小程序 视图层(xx.xml)和逻辑层(xx.js)详细介绍
2016/10/13 Javascript
JS比较两个数值的大小实例
2016/11/25 Javascript
jQuery UI Grid 模态框中的表格实例代码
2017/04/01 jQuery
浅谈react-router HashRouter和BrowserRouter的使用
2017/12/29 Javascript
webpack-mvc 传统多页面组件化开发详解
2019/05/07 Javascript
JS继承定义与使用方法简单示例
2020/02/19 Javascript
Angular+ionic实现折叠展开效果的示例代码
2020/07/29 Javascript
关于element-ui表单中限制输入纯数字的解决方式
2020/09/08 Javascript
Vue在H5 项目中使用融云进行实时个人单聊通讯
2020/12/14 Vue.js
Django1.3添加app提示模块不存在的解决方法
2014/08/26 Python
Python 实现数据库更新脚本的生成方法
2017/07/09 Python
python表格存取的方法
2018/03/07 Python
opencv 获取rtsp流媒体视频的实现方法
2019/08/23 Python
python中slice参数过长的处理方法及实例
2020/12/15 Python
10张动图学会python循环与递归问题
2021/02/06 Python
HTML5+CSS3实现机器猫
2016/10/17 HTML / CSS
销售所有的狗狗产品:Dog.com
2016/10/13 全球购物
2014年教师培训的自我评价
2014/01/03 职场文书
文员岗位职责范本
2014/03/08 职场文书
年会主持词结束语
2014/03/27 职场文书
学前班语言教学计划
2015/01/20 职场文书
《领导干部从政道德启示录》学习心得体会
2016/01/20 职场文书
如何用六步教会你使用python爬虫爬取数据
2022/04/06 Python
python数字图像处理实现图像的形变与缩放
2022/06/28 Python