如何针对鼠标悬停事件中的元素 id 值进行测试？

Question

想知道是否有人可以帮助我了解如何在鼠标悬停事件中针对元素的 ID 值进行测试。我想我必须使用“这个”。我得到的 ID 值是“未定义”function mouseOver() {  var e = $(this).attr("ID"); //need help with this bit  if (e == ("row2012")) {    alert(e)  } else {    alert(e);  }}<table>    <tr data-ng-repeat="x in Interruptions">      <td id=row{{x.year}} onmouseover="mouseOver()" onmouseout="mouseOut()">          {{x.year}}      </td>      <td>{{x.totalEvents}}</td>      <td>{{x.customers}}</td>      <td>{{x.avgDuration}}</td></table>

Answer 1

您可以通过传递this内部onmouseover&onmouseout函数直接传递当前 dom 元素，例如：

<td id=row{{x.year}} onmouseover="mouseOver(this)" onmouseout="mouseOut(this)">{{x.year}}</td>

然后访问idjs 代码中的元素，如：

function mouseOver(elem) {

  var e = elem.id;

  if (e == "row2012") {

    alert(e)

  } else {

    alert(e);

  }

}

Answer 2

使用ng-mouseenterand ng-mouseleave，并将变量传递x给两者：

<td id=row{{x.year}} ng-mouseenter ="mouseOver(x)" ng-mouseleave="mouseOut(x)">{{x.year}}</td>

然后在函数中，您可以简单地使用：

$scope.mouseOver = function(item) {

  var id = `row${item.year}`

  ...

}

Answer 3

您只需要使用以下信息。

在你的 HTML 中通过函数 mouseOver(this)

<td id="1" onmouseover="mouseOver(this)" onmouseout="mouseOut(this)">2019</td>

现在在函数中使用以下

function mouseOver(ele) {

  var eleId = $(ele).attr("Id"); //need help with this bit

  if (eleId == "yourid") {

    alert(eleId)

  } else {

    alert(eleId);

  }

}