日期:2014-05-16  浏览次数:20498 次

js实现同一页面多个全选(checkbox)
直接代码:
1、js:
<script language="javascript" type="text/javascript">
    
        function ChangeAllCheckStatus(objCheckBox, chkAllName,item)
        {
            if (objCheckBox.tagName == "INPUT" && objCheckBox.type == "checkbox")
            {
                var allInput = document.getElementsByName(item);
                for (var i = 0; i < allInput.length; i++)
                {
                    if (allInput[i].type == "checkbox" && allInput[i].name  != chkAllName)
                    {
                        allInput[i].checked = objCheckBox.checked;
                    }
                }
            }
        } 

        function IsSelectOne(chkAllName,item)
        {
            var allInput = document.getElementsByName(item);
            var count = 0;
            var argCarID = "";
            for (var i = 0; i < allInput.length; i++)
            {
                    if (allInput[i].type == "checkbox" && allInput[i].name != chkAllName )
                    {
                        if(allInput[i].checked)
                        {
                          argCarID = argCarID + allInput[i].id + "|";
                          count++;
                        }
                    }
            }
            
            document.getElementById("hide_SelectedLCID").value = argCarID;
            
            return count;
        }
        
         function BatchUpdate()
        {
            var url = "LeaderCarPrintItem.aspx?LC_IDs=" + document.getElementById("hide_SelectedLCID").value;   
            
            window.open(url,"window","");

            return false;
        }
         function DaoChu()
        {
           if(IsSelectOne('chkAll') == 0) 
           {
           alert('请选择一条记录');
           return false;  
           } else 
           { 
           return BatchUpdate();
           }  
        }
        
    </script>

2、html:

1)全选按钮

<input id="CheckAll_Now" type="checkbox" name="CheckAll_Now" onclick="ChangeAllCheckStatus(this,'CheckAll_Now','CheckItem_Now');" />


2)子按钮

<input id='<%#Eval("ID")%>' type="checkbox"  name="CheckItem_Now"/>

3)button

[url="   onclick=]<img alt=""  src="../../Content/Images/button02_21.gif" width="85" height="18" border="0" />[/url]




PS:
    主要实现记住的方法是document提供的几个方法:
  close() 关闭用 document.open() 方法打开的输出流,并显示选定的数据。 getElementById() 返回对拥有指定 id 的第一个对象的引用。
getElementsByName() 返回带有指定名称的对象集合。
getElementsByTagName() 返回带有指定标签名的对象集合。
open() 打开一个流,以收集来自任何 document.write() 或 document.writeln() 方法的输出。
write() 向文档写 HTML 表达式 或 JavaScript 代码。
writeln() 等同于 write() 方法,不同的是在每个表达式之后写一个换行符。
 

http://www.w3school.com.cn/htmldom/dom_obj_document.asp


  pS2:
      设置页面只读属性

//其中getElementsByTagName方法要合理运用
script type="text/javascript">
 

var s=window.opener.condForm.ifShow.value;//得到父页面的标签值

if("set"!=s){
var selectElements= document.getElementsByTagName("select");
for(i=0;i<selectElements.length;i++){
   selectElements[i].disabled=true;

}
var inputElements = document.getElementsByTagName("input");

for(i=0;i<inputElements.length;i++){
if(inputElements[i].type=="button"){
  inputElements[i].disabled=true;
}else{
inputElements[i].readOnly = "readonly";
}

}
window.opener.condForm.ifShow.value="set";
}
   
 
 
</script>