• 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;
    			}
    		}
        });





    
       
    
  • 相关阅读:
    CSS网站变灰
    长列表优化之滚动替换数据方案小记
    JS把数组中相同元素组合成一个新的数组问题
    yahoo CSS reset
    IE调试网页之三:使用 F12 工具控制台查看错误和状态 (Windows)
    KMP算法的JavaScript实现
    Android系统版本SDK_INT与版本对应关系
    利用jQuery的deferred异步按顺序加载JS文件
    Javascript图像处理之平滑处理
    IE调试网页之七:使用探查器工具分析代码性能 (Windows)
  • 原文地址:https://www.cnblogs.com/jzssuanfa/p/6915596.html
Copyright © 2020-2023  润新知