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

上記のようなものを.live（）のように機能させて、DOMへの動的な変更をキャッチしたいと思います。

私はこのようなことを試みました...

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

しかし、それはうまくいかないようです...

注–これは.on（）を.parent（）で追加したjQuery Liveトラバーサル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（）がコールバックをサポートしていないようです：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、セレクター（2番目）のパラメーターが.hovertipを参照していないことです。

.hovertip要素の各親でイベントをキャッチする場合は、次のように実行できます。

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

親がすべて同じクラスを持っている場合は、@MattStoneのソリューションを使用する必要があります。

更新：他の投稿であなたの答えを見ました：

$（ "。hovertip"）。parent（）。on（'hover'、function（）{alert（'yay'）;}）; は機能していますが、残念ながら、ページがAJAXを介して更新されると、機能しなくなります。

これは、イベントハンドラーがアタッチされた要素（この場合は.hovertip要素の親）が置き換えられると機能を停止するためです。

ホバーイベントハンドラーを取得する必要があるすべての要素（.hovertipのすべての親要素）にクラスを指定することをお勧めします。それなら簡単です

例：$（'body'）。on（'hover'、'.hovertip'、function（）{}）;

于 2012-10-18T06:23:33.883 に答える