獲取table中的rowIndex和cellIndex

2019-11-21 02:24:34

字體：大中小

來源：轉載

供稿：網友

在IECN里有朋友問起怎么獲取表格中某個單元格的行號與列號，可以用rowIndex和cellIndex來獲取．
具體效果請看下面的代碼

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  <html xmlns="http://www.w3.org/1999/xhtml" lang="gb2312">  <head>  <title> 獲取table中的rowIndex和cellIndex </title>  <meta http-equiv="content-type" content="text/html; charset=gb2312" />  <meta name="generator" content="editplus" />  <meta name="author" content="http://www.survivalescaperooms.com/"/>  <meta name="keywords" content="rowIndex,cellIndex" />  <script type="text/javascript">  onload = function() {   if (!document.getElementsByTagName || !document.createTextNode) return;   var rows = document.getElementById('MyTable').getElementsByTagName('tbody')[0].getElementsByTagName('tr');    var cols;   for (i = 0; i < rows.length; i++) {   rows[i].onclick = function() {   alert("行:"+eval(this.rowIndex + 1));   }      cols = rows[i].getElementsByTagName('td');      for (j = 0; j < cols.length; j++){   cols[j].onclick = function() {   alert("列:"+eval(this.cellIndex + 1));   }      }   }  }  </script>  </head>  <body>  <table id="MyTable" border="1">  <tbody>   <tr><td>行1列１</td><td>行1列２</td><td>行1列3</td></tr>   <tr><td>行2列１</td><td>行2列２</td><td>行2列3</td></tr>   <tr><td>行3列１</td><td>行3列２</td><td>行3列3</td></tr>  </tbody>  </table>  </body>  </html>

[Ctrl+A 全選注:如需引入外部Js需刷新才能執行]

上一篇：JavaScript事件列表解說

下一篇：改進：論壇UBB代碼自動插入方式