jQuery ajax ajaxStart()
およびajaxStop()
およびajaxStart()
メソッドを使用して実証しています。 これらの方法を直接使用し、それらをAjaxコールに組み込むこと、ajaxStop()
。
ajaxSetup()
および ajaxStart()
ajaxStop()
の直接使用
このメソッドには、Ajaxリクエストが進行中のフォームの送信ボタンが表示され、フォームの送信ボタンが無効になります。 リクエストが完了すると、画像が非表示になり、ボタンが再度有効になります。
var $form = $('#form'); $form.find('.loading') .hide() .ajaxStart(function() { $(this).show(); $form.find('.submit').attr('disabled', 'disabled'); }) .ajaxStop(function() { $(this).hide(); $form.find('.submit').removeAttr('disabled'); });
complete
または、AJAXの呼び出しの前に読み込みインジケーターを表示し、ハンドラーを使用して非表示にすることができます。
complete
メソッド3:グローバル処理に
// Show loading image, disable submit button $form.find('.msg').remove(); $form.find('.loading').show(); $form.find('.submit').attr('disabled', 'disabled'); // AJAX call $.ajax({ // ... your AJAX settings ... complete: function() { $form.find('.loading').hide(); $form.find('.submit').removeAttr('disabled'); } });
すべてのAJAXリクエストに影響を与えるグローバルソリューションの場合、を使用します。 これにより、読み込み画像が隠され、ajaxSetup()
の後にフォームを有効にします。
よくある質問ajaxSetup()
次のQ&Aセクションでは、
$.ajaxSetup({ complete: function() { $form.find('.loading').hide(); $form.find('.submit').removeAttr('disabled'); } });
目的:ajaxStart()
ajaxStop()
ajax要求が開始され、他のリクエストがアクティブになっているときに関数を実行します。読み込み指標を表示するのに最適です
荷重スピナーを表示:スピナー要素を作成します(例:ajaxStart()
)。 を使用して表示します。ajaxStart()
すべてのajax要求が完了したときにスピナーを非表示にするためにを使用してください。
<div id="spinner">
<code>$(document).ajaxStart(function(){ $("#spinner").show(); });
ajax要求を開始する要素(例えば、)にバインドします。
$(document).ajaxStop(function(){ $("#spinner").hide(); });
:ajaxStart()
他のajax要求が実行されていない場合にのみトリガーします。すべてのリクエストをトリガーします。
ajaxStart()
$("#myButton").ajaxStart(...)
を使用してを使用してエラーを処理します。 たとえば、ajaxStart()
ajaxSend()
他のajaxメソッドと組み合わせる: ajaxStart()
他のjquery ajaxメソッド(ajaxStop()
、ajaxComplete()
、ajaxError()
など)と連携します。
ショートサンドの方法で使用:ajaxStart()
や$.get()
。
$.post()
以上がajaxstart/ajaxsetupを使用したjquery ajaxの読み込みの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。