用js做出全选和反选效果

效果图如下:

<script language="javascript" type="text/javascript" src="js/jquery.js"></script>

<script type="text/javascript" language="javascript">

$(function(){
  $("#selecAll").click(function(){
   var isChecked=this.checked;
      $("input[name=‘rowSelect‘]").each(function() {
    if(isChecked){
     this.checked=true;
    }else{
     this.checked=false;
       }
    });
      });
  });
  
  
  
 $(function(){
  $("#reverseSelect").click(function(){
   $("input[name=‘rowSelect‘]").each(function() {
     if(this.checked){
     this.checked=false;
     }else{
     this.checked=true;
     }
               
                  });
       });
  });

</script>

用js做出全选和反选效果,布布扣,bubuko.com

时间: 2024-12-23 19:21:16

用js做出全选和反选效果的相关文章

elementUI+JS实现全选与反选

在实际项目开发过程中,遇到的需求,需要实现全选以及取消全选等功能,主要使用ElementUI + JS来实现,具体代码如下: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initia

原生js实现全选和反选以及任意一个未被选中的效果

模仿一个百度音乐的全选和反选的的操作. html代码如下: <div class="box"> <ul id="lists"> <li> <input type="checkbox" value=""> <span>我爱你中国</span> </li> <li> <input type="checkbox"

js CheckBox 全选、反选

<h3>你最喜欢的水果是?</h3> <label><input type="checkbox"/>苹果</label> <label><input type="checkbox"/>香蕉</label> <label><input type="checkbox"/>梨</label> <label>&l

利用js实现全选、反选、全不选(button)

<!DOCTYPE html><html><head><meta charset="utf-8"/><title></title><script type="text/javascript">window.onload=function(){var allSelect=document.getElementById("allSelect");var noSelec

js react 全选和反选

onCheckAll = (data) => { var CheckBox = document.getElementsByName(data); for(let i=0;i<CheckBox.length;i++){ if(CheckBox[i].checked==true){ CheckBox[i].checked=false; } else{ CheckBox[i].checked=true } }; } const columnWBS = [ {title:'WBS节点名称',data

js 实现全选反选

最近在做一个js特效:全选,反选. 效果能实现,可是只执行了一次.多次点击,发现效果不能触发了.后来查了些文档,才了解是  attr  跟 prop 的区别! 代码直接贴出来: ($("#全选ID").attr("checked") 的返回值 就是  true/false )  attr只能运行一次:   function checked_all(){                            $("input[name='XXX']:chec

html+css+js实现复选框全选与反选

1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 2 <html> 3 <head> 4 <title>html+css+js实现复选框全选与反选</title> 5 <meta http-equiv="content-type&qu

JS如何实现对name是数组的复选框的全选和反选以及取消选择

JS如何实现对name是数组的复选框的全选和反选以及取消选择? form内容如下: 因为PHP接收要用 数组形式的 复选框,正常情况下 JQ可如果是这种 直接使用 $("input[name=ptpt])即可.但是这种php接收的只是最后一个值,字符串.<label><input type='checkbox' name='ptpt' value='a1' />a1</label><label><input type='checkbox' n

Android 实现自定义多级树控件和全选与反选的效果

博文开始之前,首先要感谢大牛:(lmj623565791),本博文是在其博文http://blog.csdn.net/lmj623565791/article/details/40212367基础上进一步的修改而来. 本博文主要是利用ListView实现多级树控件,并通过CheckBox来对各节点的全选与反选的功能,首先来看一下效果: 对于多级树的显示其实就是通过数据中各个节点的关系,通过不同的缩进来达到树的效果.而数据中主要要把握id,父节点pId,name的关系,来显示其效果. 代码实现如下