javascript - 带有.parent()和动态选择器的jQuery .on()

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

我想要像.live（）这样的东西，以便它捕获DOM的动态更改。

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

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

但这似乎不起作用...

注–这是jQuery Live traversal parent() selector的延续，该地址将.on（）与.parent（）添加在一起，但动态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（）似乎不支持回调：

例如：

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

}）;

不起作用

最佳答案

您的错误是选择器（2nd）参数中的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（）{}）;