在网页表格中选中同时高亮一列的方法

来源：互联网发布：ios电子相册制作软件编辑：程序博客网时间：2024/05/16 15:24

在網頁表格中可以高亮選中一行，高亮一列就是參照這個方法改進的，下面是代碼。

//下面一段是定義樣式表，你可以通過 bgCOLOR 這個屬性改變顔色。

<STYLE type=text/css>
.tableData {
BACKGROUND: #FF0000; BORDER-BOTTOM: white 1px dashed; BORDER-LEFT: white 1px dashed; BORDER-RIGHT: white 1px dashed; BORDER-TOP: white 1px dashed; bgCOLOR: #FF0000;
}

.tableDataHit {
bgCOLOR: white;
}

</STYLE>

  if(oldCol==-1){

      oldCol=parseInt(hao);

      for(var i=0;i<rowNumber;i++){
       document.all.d[hao].className="tableData";
      hao = parseInt(hao)+10;
     }


  }else{

    hao =parseInt(hao);

    if(oldCol!=hao){

     for(var i=0;i<rowNumber;i++){
       document.all.d[oldCol].className="tableDataHit";
       oldCol = parseInt(oldCol)+10;
      }

      oldCol=hao;

      for(var i=0;i<rowNumber;i++){
      document.all.d[hao].className="tableData";
      hao = parseInt(hao)+10;
       }

       }

  }

}
</script>

//以下是一個例子可以把它直接拷貝運行。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

.tableDataHit {
bgCOLOR: white;
}

</STYLE>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=big5" />
<title></title>
<script language="javascript">
var rowNumber=5;
var oldCol=-1;
function changeColor(hao){

  if(oldCol==-1){

      oldCol=parseInt(hao);

      for(var i=0;i<rowNumber;i++){
    document.all.d[hao].className="tableData";
    hao = parseInt(hao)+10;
     }


  }else{

    hao =parseInt(hao);
   // oldCol=parseInt(oldCol);

    if(oldCol!=hao){

     for(var i=0;i<rowNumber;i++){
       document.all.d[oldCol].className="tableDataHit";
       oldCol = parseInt(oldCol)+10;
      }
      oldCol=hao;


      for(var i=0;i<rowNumber;i++){
      document.all.d[hao].className="tableData";
      hao = parseInt(hao)+10;
       }

       }

  }

}
</script>
</head>