1

特定のアンカーにカーソルを合わせると、その中のスパンを見つけて表示するjQueryスクリプトがあります。したがって、HTML 構造は次のようになります。

<a class="class" href="#">
  <img src="img.jpg"/> 
     <p>SOME TEXT</p>
  <span class="class2">
     <p>SOME CONTENT</p>
  </span>
</a>

そして、それを表示するスクリプトは次のようになります。

$('a.class').live('mouseover', function (e) {
   $(e.srcElement).find('.class2').fadeTo('slow', 1);
});

私が抱えている問題は次のとおりです。テキスト（SOME TEXT）をホバーするとホバー効果が機能しますが、画像（img.jpg）をホバーすると機能しません。私がこれを見逃している理由はありますか？a.class はアンカー内のすべてを取得する必要があるためですが、画像を取得しないのはなぜですか?

4

1 に答える 1

4

srcElementこれは、イベント オブジェクトがオブジェクトにバインドされたときに古いバージョンの Internet Explorer で使用されていたプロパティであるため、どこで を使用するのか知りたいですwindow。最初にイベントを呼び出した要素を取得したい場合はe.target、またはのいずれかを使用する必要がありますthis(ただし、this使用される場所によって参照が変わります)。

$("a.class").on("mouseenter", function(){
  $(".class2", this).fadeTo("slow", 1);
});

aこの要素はブロック レベルの要素ではないことに注意してください。高さは約20px程度です。下の画像では、アンカーの背景色を薄緑に変更しています。

ここに画像の説明を入力

ご覧のとおり、「SOME TEXT」と大きな子猫の画像は技術的にはアンカー内にネストされていますが、アンカーの境界の外にあります。表示をブロックに設定すると、これを変更できます。

a.class {
  display:block;
}

ここに画像の説明を入力

于 2012-05-08T03:23:12.500 に答える