读书人

获取table中tr的rowIndex,该怎么处理

发布时间: 2012-05-03 14:06:56 作者: rapoo

获取table中tr的rowIndex


我有一个表格是循环出来的、我想设计成当用户点击其中某一个tr时弹出一个层、这个层所显示在页面中的高度、要由tr的值决定、所以我需要获取每个循环出来tr的rowIndex 以方便计算div在屏幕上的位置、我根据网上的教程、现在获取到的rowIndex的值始终为0,请问对于while循环出来的tr难道每一行的rowIndex值都为0么?对于我这种需求还有其他处理方法么?

JScript code
function popUserDetail(x,y){    var popUp = document.getElementById("popUserDetail");        popUp.style.top="100px";        popUp.style.left="150px";        popUp.style.width="200px";        popUp.style.height="100px";        popUp.style.visibility="visible";        alert(y.rowIndex);        alert(x);    }


PHP code
           while ($records = mysql_fetch_array($rows))               {                                    $arr = ct($records['uniqueid']);                  $fileLastUploadTime  = $arr[1];                  print   '<table id="tb2">                    <tr onclick="popUserDetail('.$records["uniqueid"].',this)" onmousemove="hidePopUserDetail()">                         <td width="40px">'.st($records['lastT'],$fileLastUploadTime).'</td>                          <td width="100px">'.$records['barName'].'</td>                          <td width="160px">'.$records['lastLogin'].'</td>                          <td width="160px">'.date("Y-m-d H:i:s",$arr[1]).'</td>                          <td width="150px">'.$records['endTM'].'</td>                          <td width="40px">'.$arr[0].'</td>                          <td width="40px">'.$records['version'].'</td>                          </tr>                          </table>';                  } 


[解决办法]
rowIndex 属性返回某一行在表格的行集合中的位置(row index)

注意,这个索引号其实指的是该行在所属表格中的行索引,举个简单的例子就很清楚了:
HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title></head><body><!--表1具有一行二列--><table width="500" border="1">  <tr>    <td> </td>    <td> </td>  </tr></table><!--表2具有二行二列--><table width="500" border="1">  <tr>    <td> </td>    <td> </td>  </tr>  <tr>    <td> </td>    <td> </td>  </tr></table><script type="text/javascript">//获取所有的tr节点,两个表格加起来一共有3行var obj = document.getElementsByTagName('tr');//遍历输出各行的rowIndexfor (var i = 0; i < obj.length; i ++) alert(obj[i].rowIndex);/*运行结果:0 -- 第一个表格的第0行0 -- 第二个表格的第0行1 -- 第二个表格的第1行*/</script></body></html> 

读书人网 >JavaScript

热点推荐