0

私は次のHTMLを持っています：

<div id="panel">
  <div class="listing" id="ref_1">...</div>
  <div class="listing" id="ref_2">...</div>
  <div class="listing" id="ref_3">...</div>
  <div class="listing" id="ref_4">...</div>
</div>

私がしたいのは、誰かがにカーソルを合わせたときにdiv.listing、名前alert()を画面に表示することです。id

つまり、人がマウスでホバーすると、;id="ref_3"になります。alert("ref_3")

質問：JQuery / Javascriptでこれを行うにはどうすればよいですか？

更新：

以下にリンクされているのはライブサイトです。ご覧のとおり、以下の答えはどれも機能しません。（340行目）

http://tinyurl.com/ybbey4

何かお勧めはありますか？

4

6 に答える 6

1 
$('.listing').bind('mouseover',function(){
alert($(this).attr('id'));
});

このコードがここで機能しているのを見ることができます。

アップデート

コードを見ると、代わりにこれを試してみることをお勧めします。

$('.hlisting').live('mouseover',function(){
alert($(this).attr('id'));
});
于 2010-01-28T20:03:28.193 に答える
0

さらに良い

$('#panel div.listing').mouseover(function() {
  alert($(this).attr('id'));
});

これは動作します

<!DOCTYPE>
<html>
<head><title>test</title>
<style type="text/css">
.listing { width: 100px; height: 100px; border: 1px black solid; }
</style>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load("jquery", "1.4.1");
  google.setOnLoadCallback(function() {
    $('#panel div.listing').mouseover(function() {
        alert($(this).attr('id'));
    });
  });
</script></head>
<div id="panel">
  <div class="listing" id="ref_1">...</div>
  <div class="listing" id="ref_2">...</div>
  <div class="listing" id="ref_3">...</div>
  <div class="listing" id="ref_4">...</div>
</div>
</body>
</html>
于 2010-01-28T20:06:21.587 に答える
0

現在、他のスクリプトファイルの関数として$を使用しており、noConflictを使用していませんか？

于 2010-01-28T20:36:02.507 に答える
0

BillyJ、HTMLファイルにjQueryライブラリをロードしていないようです。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"></script>上記の関数を呼び出す前に、必ずファイルに含めてください。

于 2010-01-28T20:37:57.403 に答える
0

あなたのサイトとは別にうまく機能しているようです...

クラスを使用してコードにdivを追加することをお勧めしますhslisting。JSを使用して注入しないでください。あなたがそれを注入している方法について何かが問題を引き起こしているかどうかを確認してください。

http://jsbin.com/agosaは問題なく動作します。

于 2010-01-28T21:10:23.360 に答える
0

「mouseenter」イベントは通常、「mouseover」よりも適切な選択です。http://api.jquery.com/mouseenter/から ：

「mouseenterイベントは、イベントバブリングの処理方法がmouseoverとは異なります。この例でmouseoverを使用した場合、マウスポインターがInner要素上に移動すると、ハンドラーがトリガーされます。これは通常、望ましくない動作です。mouseenterイベント、一方、マウスがバインドされている要素に入ると、子孫ではなく、ハンドラーがトリガーされます。」

jQuery('#panel div.listing').bind('mouseenter',function(){
  alert(this.id);
  return false;
});
于 2010-01-28T21:11:17.380 に答える