0

私は ajax ローダー イメージを表示したいです。私のレール アプリでは、1 つのページに 3 つの異なるフォームがあります。これらのページはすべて ajax 化されており、同じコントローラー アクションを実行しています。ajax ローダー イメージを追加しましたが、1 つのフォームを押すと、画像はページ内のすべてのフォームに表示されます。

私のjsファイル： $("#loading-password").hide(); $("#読み込みアドレス").hide(); $("#loading").hide();

    $(document).bind("ajaxSend", function(){

      $("#loading").show();
      $("#loading-password").hide();
      $("#loading-address").hide();

      }).bind("ajaxComplete", function(){
       $("#loading").fadeOut("slow");

});


     $(document).bind("ajaxSend", function(){

       $("#loading-password").show();
       $("#loading-address").hide();
       $("#loading").hide();


     }).bind("ajaxComplete", function(){
       $("#loading-password").fadeOut("slow");


});



   $(document).bind("ajaxSend", function(){
    $("#loading-address").show();
    $("#loading-password").hide();
    $("#loading").hide();

    }).bind("ajaxComplete", function(){
     $("#loading-address").fadeOut("slow");

   });

3 つのフォームに 3 つの異なる div があります。ここで何が問題なのかわかりません。

みんな助けてください。

4

2 に答える 2

0

jQueryのドキュメントにajaxsend記載されているように、これらの関数をすべてのAJAX呼び出しにバインドしています。

Ajax リクエストが送信されようとしているときはいつでも、jQuery は ajaxSend イベントをトリガーします。この時点で、.ajaxSend() メソッドで登録されたすべてのハンドラーが実行されます。

ajaxsend基本的に、イベントごとに 3 つの関数をバインドしています。あなたが念頭に置いていることを行うには、次のことをお勧めします。

$(document).bind("ajaxSend", function(){
    $("#loading").hide();
    $("#loading-password").hide();
    $("#loading-address").hide();

  if ( settings.data === "first_form_data" ) {
    $("#loading").show();

  } else if (settings.data === "second_form_data"){

    $("#loading-password").show();

  } else if( settings.data === "third_form_data"){

    $("#loading-address").show();
  }
});

$(document).bind("ajaxComplete", function(){
  if ( settings.data === "first_form_data" ) {
    $("#loading").fadeOut("slow");

  } else if (settings.data === "second_form_data"){

    $("#loading-password").fadeOut("slow");

  } else if( settings.data === "third_form_data"){

    $("#loading-address").fadeOut("slow");
  }
});

基本的に、単一の関数をイベントにバインドし、データをチェックしてどのフォームが送信されたかを理解します。も同じですajaxComplete。

ドキュメントページでは、ajaxSendURL を使用してデータを送信している呼び出しを検出していますが、あなたの場合、すべて同じルートに到達しているため、私が理解している限りは機能しません。適切なフォームを見つけるための詳細については、settingsオブジェクトを見てください。

于 2013-11-14T08:10:28.987 に答える