获取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="枫岩,cnlei.y.l@gmail.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代码自动插入方式