2012-02-25 16 views
-2

(申し訳ありませんが、あまりにも長い間、mmmv!)私は、と一般的な最善策の疑問を持っている(3 Railsの経由)のjQueryに新たなんだ...ベストjQueryの練習

私は、ajax:beforeSendとajax:success bindingsを使ってdivをトグルしたり、表示したり、表示したり(xhr.responseTextで)埋めていくリンクを持っています。 responseTextはHTMLです:既存の電子メールアドレス用のフォームと、新しい電子メールアドレスを作成するためのリンクです。 新しいリンクをクリックすると、上のトグルで開かれたdivの上部にある空白のEメールアドレスフォームがAjax経由で読み込まれます。

新しい電子メールアドレスフォームの最初のフィールドにフォーカスを受け取り、jQuery経由で邪魔にならないようにするには、オリジナルのトグルのajaxでカスタムイベントをトリガする必要がありました:成功バインディングとカスタムイベントバインド新しいリンクへのフォーカスコード。

.live、.delegate、および.onについて読んだあと、jQueryがAjax経由でページに追加された新しいコンテンツ(つまり、「今と将来」)にマッチして動作すると思っていました。私のアプローチは、働いている間に、脆くて緊密に結合しているようです。

Ajaxを介して返されるHTMLコンテンツの動作が増えています。何か不足していてはるかに良い方法があれば興味がありますか?

下記のコードを参考にしていただき、ありがとうございます!

$(document).ready(function() { 
    $('.shows-children').bind('ajax:beforeSend', function(evnt, xhr, settings){ 

     var boxSelector = '#' + $(this).data("shows"); 

     if($(boxSelector).is(':visible')){ 
      $(boxSelector).fadeOut(function(){ 
       $(this).empty(); 
      }); 
      return false; 
     } else { 
      $(boxSelector).fadeIn(); 
     } 
    }); 

    $('.shows-children').bind('ajax:success', function(evnt, data, status, xhr){ 
     var boxSelector = '#' + $(this).data("shows"); 

     $(boxSelector).html(xhr.responseText); 
     $('a.new').trigger('set_bindings_for_new_links'); 
    }); 

}); 


$(document).on('set_bindings_for_new_links', function(){ 
    $('a.new').bind('ajax:success', function(evnt, data, status, xhr){ 
     $(this).parent().find('form[id^="new_"] :input:visible:first').focus(); 
    }) 
}); 

答えて

関連する問題