jquery貼り付けディスプレイ：ブロック

Question

私はメッセージボードを持っています。新しいメッセージが到着すると、自動的に新しいメッセージを読み込むコードがあります。 私は、以下のコードをすべての掲示板に追加しました。

$(".old_post").hover(function(){ 
      $(".post_right_nav", this).show(); 
      $(this).css({ 
       'background-color': '#E6E6E6' 
      }); 
     }, function(){ 
      var cssObj = { 
       'background-color': '', 
       'font-weight': '' 
      } 
      $(this).css(cssObj); 
      $(".post_right_nav", this).hide(); 
     });

新しい投稿はすべて、同じクラスに属していても、このホバー効果を得ることはありません。 addtionで 、AJAXを介してロードされていないすべての記事は以下のdiv持ちながら：

<div id="id_number" class="old_post" style=""> 

を新しい投稿が

<div id="id_number" class="old_post" style="display: block;"> 

サーバー側で記事を作成する機能を持っています同じ。

これに関する助力？ （AJAX-edの投稿にonHover効果を与えるにはどうすればいいですか？）

Answer 1

イベントをバインドするには、liveを使用する必要があります（docs here）。残念ながらliveはホバーをサポートしていないので、コードを分割してmouseoverとmouseoutイベントハンドラを定義する必要があります。

$(".old_post").live('mouseover', function() { 
    $(".post_right_nav", this).show(); 
    $(this).css({ 
     'background-color': '#E6E6E6' 
    }); 
}); 

$(".old_post").live('mouseout', function(){ 
    var cssObj = { 
     'background-color': '', 
     'font-weight': '' 
    } 
    $(this).css(cssObj); 
    $(".post_right_nav", this).hide(); 
});