当前位置: 首页 > 编程笔记 >

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

宋新知
2023-03-14
本文向大家介绍javascript实现checkBox的全选,反选与赋值,包括了javascript实现checkBox的全选,反选与赋值的使用技巧和注意事项,需要的朋友参考一下

我们平时在做项目的时候,经常会遇到需要实现实现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有所帮助。

 类似资料:
  • 本文向大家介绍jQuery实现checkbox列表的全选、反选功能,包括了jQuery实现checkbox列表的全选、反选功能的使用技巧和注意事项,需要的朋友参考一下   我们在做列表的时候经常会遇到全选,反选进行批量处理问题,例如:   我当时就是简单的实现了,然后想封装到公共的js中,封装的太烂,不好意思贴出来了(就是把实现代码之间放到公共js中,然后每个页面都用固定的id,class,现在想

  • 本文向大家介绍jQuery Checkbox 全选 反选的简单实例,包括了jQuery Checkbox 全选 反选的简单实例的使用技巧和注意事项,需要的朋友参考一下 1.全选、反选 以上就是本文的全部内容,希望对大家有所帮助,同时也希望多多支持呐喊教程!

  • 本文向大家介绍利用jQuery实现CheckBox全选/全不选/反选的简单代码,包括了利用jQuery实现CheckBox全选/全不选/反选的简单代码的使用技巧和注意事项,需要的朋友参考一下 jQuery有些版本中实现CheckBox全选/全不选/反选会有bug,经测试jquery-1.3.1.js–>测试通过,jquery-1.5.1.js–>测试不通过。 实现CheckBox全选/全不选/反选

  • 本文向大家介绍js与jQuery实现checkbox复选框全选/全不选的方法,包括了js与jQuery实现checkbox复选框全选/全不选的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了js与jQuery实现checkbox复选框全选/全不选的方法。分享给大家供大家参考,具体如下: 先来看看JavaScript实现checkbox复选框全选/全不选的方法。这应该是一个比较实用的前端

  • 本文向大家介绍javascript实现复选框全选或反选,包括了javascript实现复选框全选或反选的使用技巧和注意事项,需要的朋友参考一下 以下是用原生js实现的复选框全选/反选的实现,选中checkbox的时候,实现全选的效果,并且样式发生改变。 代码最简洁,js行为优化版,复制粘贴即可使用。 以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持呐喊教程。

  • 本文向大家介绍Android中ListView结合CheckBox实现数据批量选择(全选、反选、全不选),包括了Android中ListView结合CheckBox实现数据批量选择(全选、反选、全不选)的使用技巧和注意事项,需要的朋友参考一下 APP的开发中,会常遇到这样的需求:批量取消(删除)List中的数据。这就要求ListVIew支持批量选择、全选、单选等等功能,做一个比较强大的ListVi