0 
$(".hovertip").parent().on('hover', function() {
  alert('yay');
});

我想让上面的东西像 .live() 一样工作，以便它捕捉到 DOM 的动态变化。

我尝试过这样的事情......

$(".hovertip").on('hover', $(this).parent(), function() {
  alert('yay');
});

但这似乎不起作用...

注意 – 这是jQuery Live 遍历 parent() 选择器的延续，它使用 .parent() 解决了 .on() 但动态 DOM 更改问题未解决。

更新：

感谢您的建议...

在对函数执行操作时，我仍然无法让这段代码实时工作，并且在 DOM 更改时让它们像 .live 一样工作。例如......（这在 DOM 更改时不起作用）......

$(".hovertip").parent().on('mouseenter', function() {
    var hovertipParentHeight = $(this).outerHeight();
    $(this).find(".hovertip").css("top", (hovertipParentHeight-hovertipHeight)/2 + "px");

我认为问题是如果我要实施建议的解决方案，我仍然需要在主选择器之前使用 $(this).parent() 作为回调，并且似乎 .parent() 不支持回调：http： //api.jquery.com/parent/

例如：

$('.hovertip').on('hover', function(){
  $(this).parent(function() {
  var hovertipParentHeight = $(this).outerHeight();
  $(this).find(".hovertip").css("top", (hovertipParentHeight-hovertipHeight)/2 + "px");
 ...

});

不工作。

4

2 回答 2

1

.on()（和较旧的 .live()）通过侦听源自其子级的冒泡事件来工作。您可以愉快地添加/删除子元素，知道父元素仍会在听。

考虑到这一点，将 .on() 绑定到不会更改的父元素。您可以将其绑定到document.

$(".highest-level-container").on('hover', '.hovertip', function() {
    console.log($(this).parent());
});
于 2012-10-18T06:22:04.697 回答
1

您的错误是this选择器（第二个）参数中没有引用.hovertip。

如果你想在 .hovertip 元素的每个父元素中捕获事件，你可以这样做：

$('.hovertip').parent().on('hover', '.hovertip', function(){
  alert('yay');
});

如果父母都有相同的班级，您应该使用@Matt Stone 的解决方案。

更新：我刚刚在另一篇文章中看到了您的回答：

$(".hovertip").parent().on('hover', function() { alert('yay'); }); 正在工作，不幸的是，一旦页面通过 AJAX 刷新，它就会停止工作。

那是因为当附加了事件处理程序的元素（在您的情况下是 .hovertip 元素的父级）被替换时，它会停止工作。

我建议你为所有应该获得悬停事件处理程序的元素（.hovertip 的所有父元素）提供一个类。然后很容易

示例：$('body').on('hover', '.hovertip', function(){});

于 2012-10-18T06:23:33.883 回答