【jQuery】Ajaxの非同期通信を中断する

jQueryの$.ajax関数で

async: true

1	async: true

にして非同期通信を行うときに、通信を中断することができます。

やりかたは、$.ajax関数の戻り値を変数に格納し、

var ajax_obj = $.ajax({
  url: '(URL)'
 ,type: 'POST'
 ,data: '(データ)'
 ,async: true
 ,success: function(result) {
    // 成功時の処理
  }
 ,error: function(xml, error, thrown) {
    if(thrown == 'abort') {
      alert('処理を中断しました');
    }
  }
});

var ajax_obj = $.ajax({

url: '(URL)'

,type: 'POST'

,data: '(データ)'

,async: true

,success: function(result) {

// 成功時の処理

}

,error: function(xml, error, thrown) {

if(thrown == 'abort') {

alert('処理を中断しました');

}

});

中断したい場合はその変数のabortメソッドを呼びます。

ajax_obj.abort();

1	ajax_obj.abort();

abortメソッドを呼ぶと、上記の例のように
thrownに「abort」が返されますので
エラーなのか中断なのかの切り分けが可能です。

通信中にモーダルでローディング表示を行っている場合などに
ローディングダイアログに「中断」リンクをつけてあげると親切ですよね。

関連記事