Jquery cantはajaxコールの中で動作するfaceboxを取得します

Question

私のメインページから、jQuery経由でajaxファイルを呼び出します。これはajaxファイルがいくつかの追加jqueryコードです。オリジナルのリンクは次のようになります。

<a href="/page1.php" class="guest-action notify-function"><img src="/icon1.png"></a> 

次にコード：後の通知機能は、私は、アイコンやリンクのURLを変更していますクリックする

$(document).ready(function(){ 

    $('a[rel*=facebox]').facebox(); 

    $('.guest-action').click(function() { 
     $.get($(this).attr('href'), function(responseText) { 
      $.jGrowl(responseText); 
     }); 
     return false; 
    }); 

    $('.notify-function').click(function() { 
     $(this).find('img').attr('src','/icon2.png'); 
     $(this).attr('href','/page2.php'); 
     $(this).removeClass('guest-action').removeClass('notify-function').attr('rel','facebox'); 
    }); 
}); 

だから基本的に、私は、クラスを削除していますクリックがもう一度実行されず、rel = "facebox"をリンクに追加すると、表示されている新しいicon2.pngをクリックしようとすると、faceboxウィンドウがポップアップします。問題は、最初のアイコンをクリックした後で、新しいicon2.pngをクリックしようとしたときを除いて、すべてうまく動作します。まだguest-actionからjgrowlコードを実行します。しかし、ソースを見ると、次のように表示されます。

<a href="/page2.php" rel="facebox" class=""><img src="/icon2.png"></a> 

それで正しく動作するはずですか？私は間違って何をしていますか？私はajaxファイルを呼び出しているメインページにfaceboxコードを追加しようとしましたが、それと同じ問題です。

Answer 1

フェイルボックスコードを独自の関数に移動し、クラスを削除してクリックをアンバインドした後に呼び出す必要があるようです。ように：

$(document).ready(function(){ 

function reInit() { 
    $('a[rel*=facebox]').facebox(); 
} 

    $('.guest-action').click(function() { 
     $.get($(this).attr('href'), function(responseText) { 
      $.jGrowl(responseText); 
     }); 
     return false; 
    }); 

    $('.notify-function').click(function() { 
     $(this).find('img').attr('src','/icon2.png'); 
     $(this).attr('href','/page2.php'); 
     $(this).unbind('click').removeClass('guest-action').removeClass('notify-function').attr('rel','facebox'); 
reInit(); 
    }); 
});