1

我的 jQuery 悬停几乎没有问题。我制作我的个人页面并从 AJAX 加载我的数据。所以我无法弄清楚为什么悬停是窃听。首先我很艰难,因为我的元素是 position:absolute,但后来我对其进行了编辑并使其成为正常的 div。这是我的代码:

<td id="project" style="background: url('img/pctutorials-bg.png');background-repeat:no-repeat;background-position:center center;vertical-align:bottom;" >
<div class="projectinfo" >
<div class="text" >PCTutorials-BG</div>
</div>
</td>

jQuery

$(".projectinfo").hover(
  function () {
    alert("Inside");
  },
  function () {
    alert("Outside");
  }
);

可以这样做,因为这是在页面加载时不在页面上的元素上。我稍后用 AJAX 加载元素?

4

2 回答 2

1

然后你需要试试这个:

$(document).on('mouseenter', '.projectinfo', function () {
    alert("Inside");
}).on('mouseleave', '.projectinfo', function () {
    alert("Outside");
});   
于 2013-04-14T19:09:30.177 回答
1

您可以在所有当前和未来的元素上附加功能,如下mouseenter所示:mouseleave

$(function() {
  $('#project').on('mouseenter', '.projectinfo', function () {
    alert("Inside");
  }).on('mouseleave', '.projectinfo', function () {
    alert("Outside");
  });
);

参考:http ://api.jquery.com/on/

hover等价于mouseenterand mouseleave,所以hover不能直接用 with on。将这两个功能都添加到悬停有点繁重,因此最好单独使用mouseentermouseleave

我使用的原因$('#project').on是为了性能。每次创建东西时,jQuery 都必须搜索整个DOM 树来寻找节点,所以这将使 jQuery 只在下面查找。快多了。.projectinfo#project

于 2013-04-14T19:10:52.790 回答