Javascript 如何获取rowSpan TD的ID 星期一 A1单元 细胞A2 A3单元 星期二 B1室 B2单元 细胞B3

在上表中，如何获取父TD的rowSpan值？例如，如果我单击单元格A3的编辑链接，就会调用一个Javascript函数。在该函数中，我需要父TD的rowSpan值（即星期一）

---

这些和是动态创建的。

如果使用jQuery，请尝试以下方法：

<table id="foo" border="1">
  <tr>
    <td rowspan="3" class="date">Monday</td>
    <td>Cell A1 <a href="#" class="edit">edit</a></td>
  </tr>
  <tr>
    <td>Cell A2 <a href="#" class="edit">edit</a></td>
  </tr>
  <tr>
    <td>Cell A3 <a href="#" class="edit">edit</a></td>
  </tr>
  <tr>
    <td rowspan="3" class="date">Tuesday</td>
    <td>Cell B1 <a href="#" class="edit">edit</a></td>
  </tr>
  <tr>
    <td>Cell B2 <a href="#" class="edit">edit</a></td>
  </tr>
  <tr>
    <td>Cell B3 <a href="#" class="edit">edit</a></td>
  </tr>
</table>

---

现场演示：

假设在您的函数

中，此

是对

a

元素的引用，您可以执行以下操作：

$("#foo").on('click', '.edit', function(){
    var tr = $(this).closest('tr'), 
        rowspan = 0,
        text, td;

    while(tr.length && !rowspan ) {
        td = tr.find('td:first');
        rowspan = td.attr('rowspan');
        tr = tr.prev();            
    }

    alert(td.text());
})

---

或者，如果不能保证每3行一次，则可以遍历并测试

行span

var tr = this.parentNode.parentNode;

tr = tr.parentNode.rows[tr.rowIndex - (tr.rowIndex % 3)];

alert(tr.cells[0].innerHTML);

---

FWIW，您可能应该利用多个

元素。这使事情简单得多

var tr = this.parentNode.parentNode;

while (tr && tr.cells[0].rowSpan === 1)
    tr = tr.parentNode.rows[tr.rowIndex - 1];

alert(tr.cells[0].innerHTML);

---

@尤里塔拉班科：你说得对。我将其更改为

tr.cells[0]。innerHTML

@YuryTarabanko:它继续遍历，而

rowSpan

为

1

，这是默认值。因此，当它找到一个较长的

1

时，它将停止。我现在看到了问题，因为我也在迭代文本节点，所以循环会提前停止。

<table id="foo" border="1">
    <tbody>
        <tr> 
            <td rowspan="3" class="date">Monday</td> 
            <td>Cell A1 <a href="#" class="edit">edit</a></td> 
        </tr>
        <tr> 
            <td>Cell A2 <a href="#" class="edit">edit</a></td> 
        </tr>
        <tr> 
            <td>Cell A3 <a href="#" class="edit">edit</a></td> 
        </tr>
    </tbody>
    <tbody>
        <tr> 
            <td rowspan="3" class="date">Tuesday</td> 
            <td>Cell B1 <a href="#" class="edit">edit</a></td> 
        </tr>
        <tr> 
            <td>Cell B2 <a href="#" class="edit">edit</a></td> 
        </tr>
        <tr> 
            <td>Cell B3 <a href="#" class="edit">edit</a></td> 
        </tr>
    </tbody>
</table>

var tr = this.parentNode.parentNode.parentNode.rows[0];

tr.cells[0].innerHTML;