jzssuanfa

JS 控制checkbox 获取 全选 全不选 一行不选择全选则不被选择 所有选择全选被选择

//点击全选button的事件操作
    function selectAll(){  
       var allcheckBoxs=document.getElementsByName("iTo");  
       var select=document.getElementsByName("select");  
       if(select[0].checked){ //,每个都选择,全选button被选择 
          for(var i=0;i<allcheckBoxs.length;i++){  
            allcheckBoxs[i].checked = true;  
          }  
       }else{  //有一个不选择。全选button则不选择
         for(var i=0;i<allcheckBoxs.length;i++){  
           allcheckBoxs[i].checked = false;  
         }  
       }  
     }
     
     
$(\'input[name=sca]\').click(function(){
		var ckslength = $(\'input[name=sca]\').length;
		if(!$(this)[0].checked){
			$(\'#select\')[0].checked = false;
		}else if($(this)[0].checked){
			if($(\'input[name=sca]:checked\').length == ckslength){
				$(\'#select\')[0].checked = true;
			}
		}
	});/**反全选*/



<!--页面上 全选button-->
<input type=\'checkbox\' id=\'select\' name="select" onclick="selectAll();"/>

<INPUT type="checkbox" name="iTo" onclick=\'getRowValue(this);\'>选择1

<INPUT type="checkbox" name="iTo" onclick=\'getRowValue(this);\'>选择2

<INPUT type="checkbox" name="iTo" onclick=\'getRowValue(this);\'>选择3

<INPUT type="checkbox" name="iTo" onclick=\'getRowValue(this);\'>选择4

<INPUT type="checkbox" name="iTo" onclick=\'getRowValue(this);\'>选择5

当用js追加一行<input  type=\'checkbox\' name=\'iTo\' />选择6时。

用click函数已经无法监听到该“选择6”。此时应该用

live函数

   live() 方法为被选元素附加一个或多个事件处理程序,并规定当这些事件发生时执行的函数。



   通过 live() 方法附加的事件处理程序适用于匹配选择器的当前及未来的元素(比方由脚本创建的新元素)。


 $(\'input[name=iTo]\').live("click",function(){
       var ckslength = $(\'input[name=iTo]\').length;
		if(!$(this)[0].checked){
			$(\'#select\')[0].checked = false;
		}else if($(this)[0].checked){
			if($(\'input[name=iTo]:checked\').length == ckslength){
				$(\'#select\')[0].checked = true;
			}
		}
    });






   
发表于 2017-05-28 13:55  jzssuanfa  阅读(169)  评论(0编辑  收藏  举报
 

分类:

技术点:

相关文章:

  • 2021-08-22
  • 2021-08-14
  • 2021-09-20
  • 2021-11-15
  • 2022-01-02
  • 2021-11-10
  • 2022-02-08
  • 2021-12-15
猜你喜欢
  • 2021-06-08
  • 2021-11-19
  • 2021-05-10
  • 2021-09-09
  • 2021-12-24
  • 2021-11-23
  • 2021-08-14
相关资源
相似解决方案