ラボ > Javascript関連:ajax、form
js ajax+form送信で「abort」が「Uncaught TypeError」
ajaxで成功時にform.send()するとabortが読み込めない的なコトを言われた
作成日:2020-04-20, 更新日:2020-04-20
経緯
・form送信前にajaxで少し確認ってのをやっていた。
・ajaxの戻り値には問題無く、その後のform送信で何かのエラーが出ていた。
・form送信自体は問題なく先に進めていたので・・・エラーに気づかないまま月日を過ごしていた。
出力されていたエラー
Uncaught TypeError: Cannot read property 'abort' of undefined
対応等
▼問題となるソース(下記のような感じ)
$.ajax({ url: xxxx, type: 'POST', ~ 略 ~ success: function(data){ if ( data.status ) { form.submit(); return true; } else { ~ 略 ~ return false; } }, error: function(XMLHttpRequest, textStatus, errorThrown) { ~ 略 ~ } });
▼実行すると「form.submit();」の中に入って下記のようなエラー
Uncaught TypeError: Cannot read property 'abort' of undefined
▼「abort・・・? そんなの使ってない・・・」と思いつつ探したら使ってた。
$("body").on("ajaxSend", function(c, xhr) { $( window ).on( 'beforeunload', function() { xhr.abort(); }) });
▼「xhr」に「abort」が無い的な意味合いになるみたいで、下記のようにすればOK
$("body").on("ajaxSend", function(c, xhr) { $( window ).on( 'beforeunload', function() { xhr && xhr.abort(); }) });
めも
数年前に作ったソースだから・・・「xhr.abort()」を使った経緯がまったくもって思い出せない。