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 相关文章推荐
在网页中控制wmplayer播放器
Jul 01 Javascript
prototype Element学习笔记(Element篇三)
Oct 26 Javascript
JavaScript字符串对象fromCharCode方法入门实例(用于把Unicode值转换为字符串)
Oct 17 Javascript
javascript中动态函数用法实例分析
May 14 Javascript
基于JavaScript代码实现随机漂浮图片广告
Jan 05 Javascript
Vue.js基础知识汇总
Apr 27 Javascript
Bootstrap组件系列之福利篇几款好用的组件(推荐)
Jun 23 Javascript
AngularJS定时器的使用与移除操作方法【interval与timeout】
Dec 14 Javascript
jquery dataTable 后台加载数据并分页实例代码
Jun 07 jQuery
简单的Vue SSR的示例代码
Jan 12 Javascript
create-react-app 修改为多入口编译的方法
Aug 01 Javascript
解决vue 使用axios.all()方法发起多个请求控制台报错的问题
Nov 09 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
用PHP代码在网页上生成图片
2015/07/01 PHP
php实现网页缓存的工具类分享
2015/07/14 PHP
php实现二叉树中和为某一值的路径方法
2018/10/14 PHP
jquery之Document元素选择器篇
2008/08/14 Javascript
Jquery 组合form元素为json格式,asp.net反序列化
2009/07/09 Javascript
script标签属性type与language使用选择
2012/12/02 Javascript
一个JS的日期格式化算法示例
2013/07/31 Javascript
JS小功能(操作Table--动态添加删除表格及数据)实现代码
2013/11/28 Javascript
含有CKEditor的表单如何提交
2014/01/09 Javascript
分享20款美化网站的 jQuery Lightbox 灯箱插件
2014/10/10 Javascript
EasyUI实现第二层弹出框的方法
2015/03/01 Javascript
Bootstrap表单布局样式代码
2016/05/31 Javascript
angular十大常见问题
2017/03/07 Javascript
详解tween.js 中文使用指南
2018/01/05 Javascript
JS中获取 DOM 元素的绝对位置实例详解
2018/04/23 Javascript
React Navigation 使用中遇到的问题小结
2018/05/08 Javascript
Node.js操作MongoDB数据库实例分析
2020/01/19 Javascript
Python3+Pycharm+PyQt5环境搭建步骤图文详解
2019/05/29 Python
Python对接六大主流数据库(只需三步)
2019/07/31 Python
python向图片里添加文字
2019/11/26 Python
python将时分秒转换成秒的实例
2019/12/07 Python
关于tf.matmul() 和tf.multiply() 的区别说明
2020/06/18 Python
python speech模块的使用方法
2020/09/09 Python
HTML5 新标签全部总汇(推荐)
2016/06/13 HTML / CSS
体验完美剃须:The Art of Shaving
2018/08/06 全球购物
俄罗斯外国汽车和国产汽车配件网上商店:Движком
2020/04/19 全球购物
垃圾回收的优点和原理。并考虑2种回收机制
2016/10/16 面试题
电子商务专业个人的自我评价分享
2013/10/29 职场文书
优秀毕业生求职推荐信范文
2013/11/21 职场文书
先进事迹演讲稿
2014/09/01 职场文书
区长工作作风个人整改措施
2014/10/01 职场文书
2014年教务工作总结
2014/12/03 职场文书
经典导游欢迎词
2015/01/26 职场文书
幼儿园托班教育随笔
2015/08/14 职场文书
Spring Bean的实例化之属性注入源码剖析过程
2021/06/13 Java/Android
基于Redis结合SpringBoot的秒杀案例详解
2021/10/05 Redis