点击table中的行,如何获取被点击的行数?

点击table中的行,如何获取被点击的行数(即,第几行被点击了)?

解决方案 »

  1.   

    <html>
    <body>
    <head>
    <script>
    function getRowNum(row)
    {
    var table=row.parentElement;
    for(var i=0;i<table.childNodes.length;i++)
    {
    if(table.childNodes[i]==row)
    {
    alert(i+1);
    return;
    }
    }
    }
    </script>
    </head>
    <body>
        <table border="1" style="height:500px;">
         <tr onclick="getRowNum(this)">
         <td style="width:100px;">aaaaaa</td>
         </tr>
         <tr onclick="getRowNum(this)">
         <td style="width:100px;">bbbbbbb</td>
         </tr>
         <tr onclick="getRowNum(this)">
         <td style="width:100px;">cccccc</td>
         </tr>
         <tr onclick="getRowNum(this)">
         <td style="width:100px;">dddddddd</td>
         </tr>
        </table>
    </body>
    </html> 
      

  2.   


    <!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=gb2312" />
    <title>无标题文档</title>
    <script>
    function aa(event){
    var tag = window.event ? window.event.srcElement : event.target;
    if(tag.tagName == 'TD'){
    alert(tag.parentNode.rowIndex);
    }

    }
    </script></head><body>
    <table width="200" border="1" onclick="aa(event);">
      <tr >
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
      <tr >
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
      <tr >
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
    </table>
    </body>
    </html>