Question

我在表格的每一行都有一个按钮，并且在按钮上有一个处理程序：

<button onclick="handler1(event)">aa</button>

如何从事件确定行的索引？

请注意＆＃34; handler1＆＃34;的签名不能改变，即只有一个参数＆＃34; event＆＃34;可以传递给它。

function handler1(myEvent) {
   // index of a row from myEvent???
}

Answer 1

如果处理程序在某个嵌套元素上，则使用event.currentTArget遍历.parentNode，直到找到TR。

＆＃13;

function handler1(myEvent) {
  var el = myEvent.currentTarget;
  while (el && el.nodeName !== "TR") {
    el = el.parentNode;
  }
  console.log(el && el.rowIndex);
}

＆＃13;

<table>
  <tr>
    <td>
      <button onclick="handler1(event)">CLICK ME</button>
    </td>
  </tr>
  <tr>
    <td>
      <button onclick="handler1(event)">CLICK ME</button>
    </td>
  </tr>
  <tr>
    <td>
      <button onclick="handler1(event)">CLICK ME</button>
    </td>
  </tr>
</table>

＆＃13;

Answer 2

如果您有<td>内的按钮，请执行以下操作：

<table>
  <tr><td><button onclick="handler1(event)">click</button></td></tr>
  <tr><td><button onclick="handler1(event)">click</button></td></tr>
</table>

以下内容应该有效：

function handler1(event) {
  var rowIndex = event.currentTarget.parentNode.parentNode.rowIndex;
  console.log(rowIndex);
}

如何从事件中推断出一行表的索引？

2 个答案: