javascript - a.nodeName是未定义的jQuery错误

我已经看过了，但对我来说所有的解释似乎都不是很清楚。

function deleteThisRow() {
    $(this).closest('tr').fadeOut(400, function(){
        $(this).remove();
    });
}

<tr>
    <td>blah blah blah</td>
    <td>
        <img src="/whatever" onClick="deleteThisRow()">
    </td>
</tr>

最佳答案

函数中的this关键字不引用被单击的元素。默认情况下，它将引用DOM中的最高元素，即window。

要解决此问题，您可以使用不引人注目的事件处理程序，而不是过时的on*事件属性，因为它们在引发事件的元素的范围内运行。试试这个:

$("tr td img").click(deleteThisRow);

function deleteThisRow() {
  $(this).closest('tr').fadeOut(400, function() {
    $(this).remove();
  });
}

img {
  width: 20px;
  height: 20px;
  border: 1px solid #C00;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tr>
    <td>blah blah blah 1</td>
    <td><img src="/whatever"></td>
  </tr>
  <tr>
    <td>blah blah blah 2</td>
    <td><img src="/whatever"></td>
  </tr>
  <tr>
    <td>blah blah blah 3</td>
    <td><img src="/whatever"></td>
  </tr>
</table>

关于javascript - a.nodeName是未定义的jQuery错误，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/8817148/