0

私のプロジェクトでは、地域をクリックすると、郡の紋章が下部に表示されます。

私のプロジェクト

新しく追加されたクレストにホバーする jquery がいくつかあり、それらのクラスでセレクターを使用したいと考えています。各クレストには以下が追加されます。

$("#selectResult").append("<div id='"+arr[this.id]+"' class='inline'></div>");
var addThis = arr[this.id];
$("#" + addThis).css({'background-image' : 'url(./coatofarms/'+arr[this.id]+'.png)',
'background-repeat': 'no-repeat',
'background-position': 'bottom'});

私のjqueryテストホバーは次のとおりです。

 $(".inline").hover(function(){
         alert('in');
}, function(){
         alert('out');
});

クラスは.inlineですが、選択が機能しません(?) div IDでテストすると、完全に機能します。誰かが私が間違っている場所を教えてもらえますか? ティア

4

3 に答える 3

2

DOM に動的に.inline追加するため、通常のバインドはここでは機能しません。次のように実行するには、デリゲート イベント ハンドラが必要です。

$('#selectResult').on('hover', '.inline', function(e) {
   if(e.type == "mouseenter") {
      alert('In');
   } else {
      alert('Out');
   }
});

.on()デリゲート イベント ハンドラのメソッドは、次のように使用する必要があります。

$(container).on(eventName, target, handlerFunction);

ここでは、container静的要素である要素を指します。つまり、動的に追加するのではなく、ページの読み込み時に DOM に属します。回避するdocumentか参考にbodyしてください。container

于 2012-06-07T18:16:08.043 に答える
1

要素を動的に追加する場合、この場合、特定の要素をイベントにサブスクライブするためにデリゲートを設定する必要があります。

jQuery on()を使用する

何かのようなもの：

$(document).on('mouseover mouseout', '.inline', function(e){
      if(e.type == 'mouseover')
      {
         alert('in');
      }
      else if(e.type == 'mouseout')
      {
          alert('out');
      }
});
于 2012-06-07T18:07:25.103 に答える
0

これを試して ：

$(".inline").live("mouseenter",function(){
         alert('in');
}).live("mouseleave", function(){
         alert('out');
});
于 2012-06-07T18:21:14.730 に答える