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 正则替换 replace(regExp, function)用法
May 22 Javascript
根据表格中的某一列进行排序的javascript代码
Nov 29 Javascript
JavaScript实现继承的4种方法总结
Oct 16 Javascript
使用JavaScript的AngularJS库编写hello world的方法
Jun 23 Javascript
14款经典网页图片和文字特效的jQuery插件-前端开发必备
Aug 25 Javascript
Angular JS 生成动态二维码的方法
Feb 23 Javascript
js实现单张图片平移切换效果
Oct 11 Javascript
vue.js系列中的vue-fontawesome使用
Feb 10 Javascript
微信小程序五子棋游戏的悔棋实现方法【附demo源码下载】
Feb 20 Javascript
使用layui监听器监听select下拉框,事件绑定不成功的解决方法
Sep 28 Javascript
使用konva和vue-konva库实现拖拽滑块验证功能
Apr 27 Javascript
vue打开子组件弹窗都刷新功能的实现
Sep 21 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
水质对咖图啡风味的影响具体有哪些
2021/03/03 冲泡冲煮
微盾PHP脚本加密专家php解密算法
2020/09/13 PHP
测试php连接mysql是否成功的代码分享
2014/01/24 PHP
PHP快速生成各种信息提示框的方法
2016/02/03 PHP
User Scripts: Video Download by User Scripts
2007/05/14 Javascript
javascript获取select的当前值示例代码(兼容IE/Firefox/Opera/Chrome)
2013/12/17 Javascript
JQuery异步加载无限下拉框级联功能实现示例
2014/02/19 Javascript
JS获取客户端IP地址、MAC和主机名的7个方法汇总
2014/07/21 Javascript
jQuery超赞的评分插件(8款)
2015/08/20 Javascript
js实现正则匹配中文标点符号的方法
2015/12/23 Javascript
MVC+jQuery.Ajax异步实现增删改查和分页
2020/12/22 Javascript
Node.js中常规的文件操作总结
2016/10/13 Javascript
详解vue-cli项目中的proxyTable跨域问题小结
2018/02/09 Javascript
vue init webpack myproject构建项目 ip不能访问的解决方法
2018/03/20 Javascript
layer.close()关闭进度条和Iframe窗的方法
2018/08/17 Javascript
vuejs 动态添加input框的实例讲解
2018/08/24 Javascript
vue+element UI实现树形表格带复选框的示例代码
2019/04/16 Javascript
安装dbus-python的简要教程
2015/05/05 Python
详解Python编程中对Monkey Patch猴子补丁开发方式的运用
2016/05/27 Python
python模块简介之有序字典(OrderedDict)
2016/12/01 Python
python字符串string的内置方法实例详解
2018/05/14 Python
python实现随机梯度下降法
2020/03/24 Python
pyqt5利用pyqtDesigner实现登录界面
2019/03/28 Python
Django静态文件加载失败解决方案
2020/08/26 Python
python 使用cycle构造无限循环迭代器
2020/12/02 Python
css3实现信纸/同学录效果的示例代码
2018/12/11 HTML / CSS
html5理解head_动力节点Java学院整理
2017/07/13 HTML / CSS
梅西百货官网:Macy’s
2020/08/04 全球购物
施工资料员岗位职责
2014/01/06 职场文书
《囚绿记》教学反思
2014/03/01 职场文书
政府采购方案
2014/06/12 职场文书
企业法人任命书
2015/09/21 职场文书
解决ObjectMapper.convertValue() 遇到的一些问题
2021/06/30 Java/Android
http通过StreamingHttpResponse完成连续的数据传输长链接方式
2022/02/12 Python
Win11快速关闭所有广告推荐
2022/04/19 数码科技
python基础之//、/与%的区别详解
2022/06/10 Python