求助!=====限制表格某列操作的问题=====


<html > 
<head > 
<title > </title > 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" / > 
</head > 
<body > 
<center > 
<script type="text/javascript" > 
var filtercolumns="";function Search(Tbl,TextValue) 
{ 
   var count=0; 
   var keyWord=TextValue.value; 
   if(keyWord!="") 
   { 
     for(var i=0;i <Tbl.rows.length;i++) 
     { 
         if(filtercolumns=="")
         {
            var tr=Tbl.rows[i]; 
            if(tr.innerHTML.indexOf(keyWord)==-1) 
              tr.style.display="none"; 
            else 
            { 
              tr.style.display="block"; 
              count++; 
            } 
         }
         
         else
         {
             var tfilter = filtercolumns.substr(0,filtercolumns.length-1);
             var columns = tfilter.split('|');
             var html = "";
             
             for(var k=0;k<Tbl.rows[i].cells.length;k++)
             {
                 var flag = true;
                 for(var j=0;j<columns.length;j++)
                 {
                     var col= columns[j];
                     if(col==k) flag=false;
                 }
                 if(flag==true)
                 {
                     html += Tbl.rows[i].cells[k].innerHTML;
                 }
             }             if(html.indexOf(keyWord)==-1) 
              Tbl.rows[i].style.display="none"; 
            else 
            { 
              Tbl.rows[i].style.display="block"; 
              count++; 
            } 
         }
     } 
   } 
   if(count==0) 
   { 
     ListAll(Tbl); 
     alert( '找不到你要的记录！ '); 
   } 
} function ListAll(Tbl) 
{ 
  filtercolumns="";
  for(var i=0;i <Tbl.rows.length;i++) 
  { 
    Tbl.rows[i].style.display="block"; 
    for(var j=0;j<Tbl.rows[0].cells.length;j++)
    {
       Tbl.rows[i].cells[j].style.backgroundColor = '#ffffff';
    }
  } 
} function setFilter()
{
    var obj = event.srcElement;
    var column = obj.cellIndex;
    var tab = obj.parentElement.parentElement;
    
    if(obj.tagName!="TD")return;
    
    if(filtercolumns.indexOf(column)>-1)
    {
        var temp = filtercolumns.replace(column+'|','');
        filtercolumns = temp;
        for(var i=0;i<tab.rows.length;i++)
        {
            tab.rows[i].cells[column].style.backgroundColor = '#ffffff';
        }
    }
    
    else
    {
        var temp = filtercolumns+column+'|';
        filtercolumns = temp;
        for(var i=0;i<tab.rows.length;i++)
        {
            tab.rows[i].cells[column].style.backgroundColor = '#eeeeee';
        }
    } 
}</script > 
<asp:Label ID="label1" runat="server">请点击列选择不参加过滤列</asp:Label>
<input name="ttt" id="ttt" type="text" style="width:200"  > 
<input type="button" value="查找" onclick="Search(Tbl1,ttt)" id="btFind" > 
<input type="button" value="返回" onclick="ListAll(Tbl1)"  id="btListAll" > <br > 
<table width="500" id="Tbl1" border="1" onclick="setFilter()"> 
<tr > <td >12 </td > <td >34 </td > <td >45 </td > <td >45 </td > </tr > 
<tr > <td >呵呵 </td > <td >56 </td > <td >1911 </td > <td >2 </td > </tr > 
<tr > <td >12 </td > <td >55 </td > <td >1920 </td > <td >3 </td > </tr > 
<tr > <td >ddd </td > <td >12 </td > <td >13 </td > <td >2356 </td > </tr > 
<tr > <td >呵呵 </td > <td >55 </td > <td >1877 </td > <td >rt </td > </tr > 
<tr > <td >ddeed </td > <td >11 </td > <td >12 </td > <td >hh </td > </tr > 
<tr > <td >ddafd </td > <td >58 </td > <td >1988 </td > <td >77 </td > </tr > 
</table > 
</center > 
</body > 
</html >

解决方案 »

  1.   

    郁闷，每次贴上来js系统都会在''之间多加空格，以前也这样LZ要运行代码要先把''之间多余的空格去掉才行
      

  2.   

    <html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    </head>
    <body>
        <center>        <script type="text/javascript">  
           
            
    var filtercolumns=""; function window.onload()
    {
        setFilter(Tbl1);
    }
    function setFilter(Tbl)
    {
        for(var i=0;i<Tbl.rows[0].cells.length;i++)
        {
            if(Tbl.rows[0].cells[i].getAttribute("filter")!=null &&Tbl.rows[0].cells[i].getAttribute("filter")=="false")
            {
                for(var j=0;j<Tbl.rows.length;j++)
                {
                    Tbl.rows[j].cells[i].style.backgroundColor="#eeeeee";
                }
                var temp = filtercolumns+i+ '¦'; 
                filtercolumns = temp; 
            }
        }
    }function Search(Tbl,TextValue)  
    {  
       var count=0;  
       var keyWord=TextValue.value;  
       if(keyWord!="")  
       {  
         for(var i=0;i  <Tbl.rows.length;i++)  
         {  
             if(filtercolumns=="") 
             { 
                var tr=Tbl.rows[i];  
                if(tr.innerHTML.indexOf(keyWord)==-1)  
                  tr.style.display="none";  
                else  
                {  
                  tr.style.display="block";  
                  count++;  
                }  
             } 
              
             else 
             { 
                 var tfilter = filtercolumns.substr(0,filtercolumns.length-1); 
                 var columns = tfilter.split( '¦'); 
                 var html = ""; 
                  
                 for(var k=0;k <Tbl.rows[i].cells.length;k++) 
                 { 
                     var flag = true; 
                     for(var j=0;j <columns.length;j++) 
                     { 
                         var col= columns[j]; 
                         if(col==k) flag=false; 
                     } 
                     if(flag==true) 
                     { 
                         html += Tbl.rows[i].cells[k].innerHTML; 
                     } 
                 }              if(html.indexOf(keyWord)==-1)  
                  Tbl.rows[i].style.display="none";  
                else  
                {  
                  Tbl.rows[i].style.display="block";  
                  count++;  
                }  
             } 
         }  
       }  
       if(count==0)  
       {  
         ListAll(Tbl);  
         alert(  '找不到你要的记录！');  
       }  
    }  function ListAll(Tbl)  
    {  
      for(var i=0;i  <Tbl.rows.length;i++)  
      {  
        Tbl.rows[i].style.display="block";  
      }  
    }  
    </script>        <input name="ttt" id="ttt" type="text" style="width: 200">
            <input type="button" value="查找" onclick="Search(Tbl1,ttt)" id="btFind">
            <input type="button" value="返回" onclick="ListAll(Tbl1)" id="btListAll">
            <br>
            <table width="500" id="Tbl1" border="1" >
                <tr>
                    <td filter="false">
                        12
                    </td>
                    <td filter="false">
                        34
                    </td>
                    <td>
                        45
                    </td>
                    <td>
                        45
                    </td>
                </tr>
                <tr>
                    <td>
                        呵呵
                    </td>
                    <td>
                        56
                    </td>
                    <td>
                        1911
                    </td>
                    <td>
                        2
                    </td>
                </tr>
                <tr>
                    <td>
                        12
                    </td>
                    <td>
                        55
                    </td>
                    <td>
                        1920
                    </td>
                    <td>
                        3
                    </td>
                </tr>
                <tr>
                    <td>
                        ddd
                    </td>
                    <td>
                        12
                    </td>
                    <td>
                        13
                    </td>
                    <td>
                        2356
                    </td>
                </tr>
                <tr>
                    <td>
                        呵呵
                    </td>
                    <td>
                        55
                    </td>
                    <td>
                        1877
                    </td>
                    <td>
                        rt
                    </td>
                </tr>
                <tr>
                    <td>
                        ddeed
                    </td>
                    <td>
                        11
                    </td>
                    <td>
                        12
                    </td>
                    <td>
                        hh
                    </td>
                </tr>
                <tr>
                    <td>
                        ddafd
                    </td>
                    <td>
                        58
                    </td>
                    <td>
                        1988
                    </td>
                    <td>
                        77
                    </td>
                </tr>
            </table>
        </center>
    </body>
    </html>
      

  3.   

    公用函数是setFilter，调用页面onload函数里把table对象传进来即可
    上面例子是第一，二列为不参加过滤列，属性设置为filter＝false