0

以前にこの問題が発生したことを覚えていますが、どのプロジェクトにあったのか、どのように修正したのかわかりません。

ajaxの[お気に入りに追加]ボタンがあります。また、ページの下部に到達したときにajaxがページをロードする無限スクロールもあります。問題は、ajaxが新しく追加されたコンテンツに適用されないことです

// Favorites
  $('.res-list .star').click(function(){
    var starLink = $(this);
    var listItem = $(this).parent().parent();

    if ($(starLink).hasClass('starred')) {
       $(starLink).removeClass('starred');
     } else {
       $(starLink).addClass('starred');
     }
     $.ajax({
       url: '/favorites/?id=' + $(starLink).attr('data-id'),
       type: 'PUT',
       success: function() {

         if ($(starLink).hasClass('starred')) {
           $(listItem).animate({
             backgroundColor: '#FFF8E4'
           }, 400);
         } else {
           $(listItem).animate({
             backgroundColor: '#ffffff'
           }, 400);
         }
       }
     });
     return false;
  });
4

2 に答える 2

4

ライブイベントが必要です

$('.res-list').on('click', '.star', function() {

   // code here
});

またはdelegate（）を使用します

$('.res-list').delegate('.star', 'click', function() {

       // code here
    });

デリゲート（）について読む

on（）について読む

于 2012-05-13T16:46:38.630 に答える
0

.bind() メソッドは、一致するすべてのアンカーにイベント ハンドラーをアタッチします。それはよくありません。イベント ハンドラーをアタッチするためにこれらすべての項目を暗黙的に反復処理するのはコストがかかるだけでなく、同じイベント ハンドラーが何度も繰り返されるため無駄が多くなります。

.delegate() メソッドは .live() メソッドと同様に動作しますが、セレクター/イベント情報をドキュメントに添付する代わりに、固定する場所を選択できます。.live() メソッドと同様に、この手法はイベント委任を使用して正しく機能します。

于 2012-05-13T16:52:32.477 に答える