js 判断checkbox是否选中的实现代码


Posted in Javascript onNovember 23, 2010

今天再写个小功能判断checkbox是否选中与操作完以后将checkbox设置为选中状态的需求,那么就可以参考下面的代码了

1、判断是否选中可以用如下代码

原生js

if(document.getElementById("insDown").checked){

}

jquery的实现代码

1, $(checkbox的id).prop("checked") 返回的是一个boolean值类型

2, $(this).is(":checked") 返回的也是一个boolean值类型2

、设置选中状态

原生js

document.getElementById("insDown").checked=true;

jquery的实现代码

$("#insDown").prop("checked", true);

$("#cb1").prop("checked","checked");
$("#cb1").prop("checked",true);

完整代码

//第几个没有选 

<input type="checkbox" name="checkbox1" checked> 
<input type="checkbox" name="checkbox1"> 
<input type="checkbox" name="checkbox1" checked> 
<input type="checkbox" name="checkbox1"> 
<input type="checkbox" name="checkbox1"> 
<script language=javascript> 
function check(obj) 
{ 

for(i=0;i<document.all(obj).length;i++) 
{ 
if(!document.all(obj)[i].checked)alert("第"+(i+1)+"个没有选择") 
} 
} 
</script> 
<input type=button onclick="check('checkbox1')" value="检测"> 
//一个也没有选 
<input type="checkbox" name="test"> 
<input type="checkbox" name="test"> 
<input type="checkbox" name="test"> 
<input type="checkbox" name="test"> 
<input type="checkbox" name="test"> 
<Script Language="JavaScript"> 
function check(obj){ 
for(i=0;i<document.all(obj).length;i++){ 
if(document.all(obj)(i).checked){ 
return; 
} 
} 
window.alert('一个也没有选!'); 
} 
</Script> 
<input type=button onclick="check('test');" value="检测"> 

//第几个没有选 
<input type="checkbox" name="checkbox1" checked> 
<input type="checkbox" name="checkbox1"> 
<input type="checkbox" name="checkbox1" checked> 
<input type="checkbox" name="checkbox1"> 
<input type="checkbox" name="checkbox1"> 
<script language=javascript> 
function check(obj) 
{ 

for(i=0;i<document.all(obj).length;i++) 
{ 
if(!document.all(obj)[i].checked)alert("第"+(i+1)+"个没有选择") 
} 
} 
</script> 
<input type=button onclick="check('checkbox1')" value="检测"> 


//一个也没有选 


<input type="checkbox" name="test"> 
<input type="checkbox" name="test"> 
<input type="checkbox" name="test"> 
<input type="checkbox" name="test"> 
<input type="checkbox" name="test"> 
<Script Language="JavaScript"> 
function check(obj){ 
for(i=0;i<document.all(obj).length;i++){ 
if(document.all(obj)(i).checked){ 
return; 
} 
} 
window.alert('一个也没有选!'); 
} 
</Script> 
<input type=button onclick="check('test');" value="检测">

这篇文章就结束了,更多的请查看三水点靠木以前发布的文章。

Javascript 相关文章推荐
jQuery MD5加密实现代码
Mar 15 Javascript
IE8 中使用加速器(Activities)
May 14 Javascript
js实现在字符串中提取数字
Nov 05 Javascript
JS中判断null、undefined与NaN的方法
Mar 26 Javascript
Jquery全屏相册插件zoomvisualizer具有调节放大与缩小功能
Nov 02 Javascript
node.js学习之base64编码解码
Oct 21 Javascript
JS触摸屏网页版仿app弹窗型滚动列表选择器/日期选择器
Oct 30 Javascript
原生js二级联动效果
Jun 20 Javascript
浅析前端路由简介以及vue-router实现原理
Jun 01 Javascript
JS使用百度地图API自动获取地址和经纬度操作示例
Apr 16 Javascript
如何使用50行javaScript代码实现简单版的call,apply,bind
Aug 14 Javascript
node.js处理前端提交的GET请求
Aug 30 Javascript
js 处理URL实用技巧
Nov 23 #Javascript
两个Javascript小tip资料
Nov 23 #Javascript
JQUBar 基于JQUERY的柱状图插件
Nov 23 #Javascript
jquery 学习之二 属性相关
Nov 23 #Javascript
jquery 学习之一 对象访问
Nov 23 #Javascript
boxy基于jquery的弹出层对话框插件扩展应用 弹出层选择器
Nov 21 #Javascript
IE6下出现JavaScript未结束的字符串常量错误的解决方法
Nov 21 #Javascript
You might like
如何分别全角和半角以避免乱码
2006/10/09 PHP
php中base64_decode与base64_encode加密解密函数实例
2014/11/24 PHP
php生成短域名函数
2015/03/23 PHP
php自定义排序uasort函数示例【二维数组按指定键值排序】
2019/06/19 PHP
JS request函数 用来获取url参数
2010/05/17 Javascript
通过jquery还原含有rowspan、colspan的table的实现方法
2012/02/10 Javascript
node.js中的fs.mkdir方法使用说明
2014/12/17 Javascript
Nodejs学习笔记之NET模块
2015/01/13 NodeJs
js实现单击图片放大图片的方法
2015/02/17 Javascript
javascript中in运算符用法分析
2015/04/28 Javascript
JavaScript基于ajax编辑信息用法实例
2015/07/15 Javascript
js实现的二级横向菜单条实例
2015/08/22 Javascript
jQuery使用zTree插件实现树形菜单和异步加载
2016/02/25 Javascript
jQuery实现带遮罩层效果的blockUI弹出层示例【附demo源码下载】
2016/09/14 Javascript
JS判断输入的字符串是否是数字的方法(正则表达式)
2016/11/29 Javascript
javascript 中模板方法单例的实现方法
2017/10/17 Javascript
js实现把时间戳转换为yyyy-MM-dd hh:mm 格式(es6语法)
2017/12/28 Javascript
vue-image-crop基于Vue的移动端图片裁剪组件示例
2018/08/28 Javascript
Python中用于检查英文字母大写的isupper()方法
2015/05/19 Python
关于numpy中np.nonzero()函数用法的详解
2017/02/07 Python
开源Web应用框架Django图文教程
2017/03/09 Python
pandas 数据实现行间计算的方法
2018/06/08 Python
Python递归函数实例讲解
2019/02/27 Python
flask利用flask-wtf验证上传的文件的方法
2020/01/17 Python
美国领先的礼品卡网站:GiftCards.com
2016/11/02 全球购物
俄罗斯旅游网站:Tripadvisor俄罗斯
2017/03/21 全球购物
大学生个人总结的自我评价
2013/10/05 职场文书
就业推荐自我鉴定
2013/10/06 职场文书
2014年公司植树节活动方案
2014/03/04 职场文书
团支部推优材料
2014/05/21 职场文书
承诺书样本
2014/08/30 职场文书
工资收入证明样本(5篇)
2014/09/16 职场文书
Nginx如何配置Http、Https、WS、WSS的方法步骤
2021/05/11 Servers
「玫瑰之王的葬礼」舞台剧主视觉图公开
2022/03/21 日漫
muduo TcpServer模块源码分析
2022/04/26 Redis
Android移动应用开发指南之六种布局详解
2022/09/23 Java/Android