javascript实现checkBox的全选,反选与赋值


Posted in Javascript onMarch 12, 2015

我们平时在做项目的时候,经常会遇到需要实现实现checkBox的全选,反选与赋值的情况,网上也有许多的范例,这里给大家分享的是本人常用的方法,推荐给大家。

//js 数值是否在数组中

Array.prototype.in_array = function(e){
for(i=0;i<this.length;i++){


if(this[i] == e)



return true;

}

return false;

}

//js数组index

Array.prototype.find_str=function(string){

var str = this.join("");

return str.indexOf(string);

}

var houseIds=new Array();

$("#chebox-list-all").click(function(){

if($("#chebox-list-all").attr("checked")){


$("[name='checkboxes']").attr("checked",'true');//全选 增加id


var ids = document.getElementsByName('checkboxes');


var value = new Array();


for(var i = 0; i < ids.length; i++){



if(ids[i].checked)



houseIds.push(ids[i].value);


}

alert(houseIds);

}else{


$("[name='checkboxes']").removeAttr("checked");//反选 删除Ids


houseIds=[];


alert(houseIds);

}

})

//单选增加id

function check(obj){

if(!houseIds.in_array(obj.value)){


houseIds.push(obj.value);


alert(houseIds);

}else{


var index=houseIds.find_str(obj.value);


houseIds.splice(index, 1)


alert(houseIds);

}

}

以上就是本示例的全部代码了,希望对大家学习使用javascript控制checkbox有所帮助。

Javascript 相关文章推荐
javascript实现动态增加删除表格行(兼容IE/FF)
Apr 02 Javascript
jQuery中height()方法用法实例
Dec 24 Javascript
JavaScript动态修改网页元素内容的方法
Mar 21 Javascript
JS实现的简洁二级导航菜单雏形效果
Oct 13 Javascript
JS实现的鼠标跟随代码(卡通手型点击效果)
Oct 26 Javascript
使用JQuery FancyBox插件实现图片展示特效
Nov 16 Javascript
JS代码随机生成姓名、手机号、身份证号、银行卡号
Apr 27 Javascript
js实现动态增加文件域表单功能
Oct 22 Javascript
js异步上传多张图片插件的使用方法
Oct 22 Javascript
mock.js模拟前后台交互
Jul 25 Javascript
对layui初始化列表的CheckBox属性详解
Sep 13 Javascript
Element Tooltip 文字提示的使用示例
Jul 26 Javascript
jQuery通过扩展实现抖动效果的方法
Mar 11 #Javascript
jQuery实现字符串按指定长度加入特定内容的方法
Mar 11 #Javascript
jquery利用命名空间移除绑定事件的方法
Mar 11 #Javascript
jQuery实现带动画效果的二级下拉导航方法
Mar 11 #Javascript
jquery图形密码实现方法
Mar 11 #Javascript
jQuery模拟新浪微博首页滚动效果的方法
Mar 11 #Javascript
jQuery实现在textarea指定位置插入字符或表情的方法
Mar 11 #Javascript
You might like
C#静态方法与非静态方法实例分析
2014/09/22 PHP
10款PHP开源商城系统汇总介绍
2015/07/23 PHP
php自定义排序uasort函数示例【二维数组按指定键值排序】
2019/06/19 PHP
JQuery将文本转化成JSON对象需要注意的问题
2011/05/09 Javascript
什么是MEAN?JavaScript编程中的MEAN是什么意思?
2014/12/18 Javascript
jQuery对象初始化的传参方式
2015/02/26 Javascript
AngularJS教程之MVC体系结构详解
2016/08/16 Javascript
最实用的jQuery分页插件
2016/10/09 Javascript
Vue学习之axios的使用方法实例分析
2020/01/06 Javascript
python调用Moxa PCOMM Lite通过串口Ymodem协议实现发送文件
2014/08/15 Python
Python中使用Inotify监控文件实例
2015/02/14 Python
python实现根据ip地址反向查找主机名称的方法
2015/04/29 Python
Python定时执行之Timer用法示例
2015/05/27 Python
python 正确保留多位小数的实例
2018/07/16 Python
python中join()方法介绍
2018/10/11 Python
Python3.5迭代器与生成器用法实例分析
2019/04/30 Python
把django中admin后台界面的英文修改为中文显示的方法
2019/07/26 Python
简单了解python shutil模块原理及使用方法
2020/04/28 Python
python网络编程之五子棋游戏
2020/05/14 Python
python 元组的使用方法
2020/06/09 Python
HTML5触摸事件(touchstart、touchmove和touchend)的实现
2020/05/08 HTML / CSS
美国顶级奢侈茶:Mighty Leaf Tea(美泰茶)
2016/11/26 全球购物
三星美国官网:Samsung美国
2017/02/06 全球购物
机械专业毕业生推荐信范文
2013/11/25 职场文书
自荐信格式简述
2014/01/25 职场文书
文明学生事迹材料
2014/01/29 职场文书
法人代表身份证明书及授权委托书
2014/09/16 职场文书
社区党风廉政建设调研报告
2015/01/01 职场文书
出生公证书
2015/01/23 职场文书
中标通知书
2015/04/17 职场文书
小学生勤俭节约倡议书
2015/04/29 职场文书
贷款工作证明模板
2015/06/12 职场文书
2016年寒假社会实践活动总结
2015/10/10 职场文书
学校体育节班级口号
2015/12/25 职场文书
python 定义函数 返回值只取其中一个的实现
2021/05/21 Python
CSS实现九宫格布局(自适应)的示例代码
2022/02/12 HTML / CSS