【javascript学习指南】javascrip全选效果之学习笔记

更新时间:2018-01-20    来源:组件控件开发    手机版     字体:

【www.bbyears.com--组件控件开发】

document.getElementById(" ")是某个元素的id特性来获取某个指定的元素,返回的是一个对象。document.getElementById(" ") 是根据控件TAG(type属性)获取这个控件对象,返回的是一个对象数组;

要实现一个全选的效果,得先定义一组选项。

 代码如下


 

全选


    

    

    

    

    

    

    

 

接下利用Javascript来实现效果。教程中的效果是只能点全选时全部选中,如果再点全选就不能全部反选,这里我通过自己的理解,加入了这个功能

 代码如下

<script type="text/javascript">   
 window.onload=function(){
    
     var oInput=document.getElementsByTagName("input")
     var ohk=document.getElementById("hk")
     ohk.onclick=function(){
         var i=0;
         if(ohk.checked==true){
         for(i=0;i          {
             oInput[i].checked=true;
             }
         }
         else
         {
             for(i=0;i          {
             oInput[i].checked=false;
            
         }
            
         }
     };
 };
 </script>

个人感觉此种方法还是有所欠缺,他会将页面中所有的类型为input的选中.现在我们写了一个利用点击事件来进行全选也反选效果。

 代码如下


<script language="javascript">
function selectAll()
{
obj=document.getElementsByName("range");
for(var i=0;i {
 //document.form1.range[i].checked=true;
 obj.item(i).checked=true;
 
}
}
function unSelect()
{  
 obj=document.getElementsByName("range");
 for(var i=0;i  {
  if(obj.item(i).checked)
 {
  obj.item(i).checked=false;
 }
else
 {
  obj.item(i).checked=true;
 }
}
}
</script>


1





这样如果结合php程序也实现删除功能我们只需要把获取的字符串以post或get方式提供就可以了,下面来看get方式提供。

 代码如下

//批量删除   
//na 是name  
function checkSubmit(na,url)
{
 
    var str = "";
    for(var i=0;i < document.getElementsByName(na).length;i++)
    {
          if(document.getElementsByName(na)[i].checked){
            if(str=="") str += document.getElementsByName(na)[i].value;
            else str += "," + document.getElementsByName(na)[i].value;
          }
    }
    if(str=="")
    {
        alert("你没选择任何内容!");
        return false;
    }
    else
    {
        location=url+"?id="+str+"&action=delall";
    }
}

在php程序中我们就要以

 代码如下

$a = $_GET["id"];

然后利用where id in( $a ) 即可实现删除了哦,这也算是一简单php教程吧,有需要的朋友可学习交流。

本文来源:http://www.bbyears.com/asp/38655.html