表單提交之后還想搞點(diǎn)事情
前言
表單提交是瀏覽器中一個(gè)很特殊的事件驯妄，它像一個(gè)異步事件檐嚣，submit之后還可以執(zhí)行后面的代碼，直到頁(yè)面頁(yè)面跳轉(zhuǎn)琴昆。如果提交后好像做點(diǎn)事情氓鄙，可能會(huì)遇到以下兩個(gè)問(wèn)題：
1馆揉、提交后立即關(guān)閉窗口业舍，可能會(huì)出現(xiàn)數(shù)據(jù)只提交了一部分
2、提交后還想執(zhí)行一些代碼
首先確認(rèn)兩個(gè)情況：
1升酣、submit()后立即alert()會(huì)阻止表單的提交直到點(diǎn)擊確定舷暮。
2、submit()后的代碼都會(huì)執(zhí)行噩茄，但不一定生效下面。
alert是一個(gè)神奇的東西它可以暫停代碼執(zhí)行，它也可以阻止頁(yè)面跳轉(zhuǎn)绩聘。
我們?cè)诮栌靡粋€(gè)方法setTimeout沥割，時(shí)間設(shè)為 0，就代表立即插入隊(duì)列凿菩，但不是立即執(zhí)行机杜。
直接上代碼：
form.submit(); // 表單提交
setTimeout(function(){
// 準(zhǔn)備做一些其它的事情
setTimeout(function(){
a = 10;
for (var i = 500000000; i >= 0; i--) {
a += i;
}
alert(a);
}, 0);
alert('已提交'); //彈出提示，阻止頁(yè)面跳轉(zhuǎn)
},0);
執(zhí)行順序分析：
第一步：表單開始提交
第二步：彈出提示衅谷，表單如果還沒(méi)提交完會(huì)繼續(xù)
第三步：第二個(gè)setTimeout里的回調(diào)函數(shù)開始執(zhí)行
彈出第一個(gè)alert的作用是阻止頁(yè)面跳轉(zhuǎn)椒拗，等用戶點(diǎn)擊確定表單也差不多提交完了。后面的也基本執(zhí)行完了获黔。
這代碼適用于表單數(shù)據(jù)不會(huì)太大蚀苛，后面的任務(wù)也不會(huì)太重的情況。
如果提交完就關(guān)閉玷氏，可以在alert()后面寫關(guān)閉代碼堵未。
其實(shí)以上代碼沒(méi)有任何卵用，chrome中運(yùn)行效果還勉強(qiáng)夠用盏触，但I(xiàn)E11和EDGE絕對(duì)讓你懷疑人生兴溜。
IE11和EDGE有個(gè)奇葩的情況，submit()再執(zhí)行alert()就不提交了耻陕，就是說(shuō)提交事件實(shí)際開始之前彈出alert就放棄提交了拙徽！誰(shuí)能解釋著到底是為啥？
看來(lái)ajax異步提交才是最好的方式诗宣，那些gbk代碼的項(xiàng)目只能把js放到跳轉(zhuǎn)后的頁(yè)面去執(zhí)行了膘怕。
