初次使用$.ajax() ,我沒有去區(qū)分過ajax的異步請(qǐng)求和同步請(qǐng)求的不同，剛開始使用同步請(qǐng)求，以至后來出現(xiàn)許多問題，特別在體驗(yàn)度方面。
異步和同步：
同步意味著執(zhí)行完一段程序才能執(zhí)行下一段，它屬于阻塞模式，其表現(xiàn)在網(wǎng)頁上的現(xiàn)象是——瀏覽器會(huì)鎖定頁面（即所謂的頁面假死狀態(tài)），用戶不能操作其它的，必須等待當(dāng)前請(qǐng)求返回?cái)?shù)據(jù)。而使用異步方式請(qǐng)求，頁面不會(huì)出現(xiàn)假死現(xiàn)象。
提升用戶體驗(yàn)度：
當(dāng)用戶提交數(shù)據(jù)等待頁面返回結(jié)果是需要時(shí)間的，有時(shí)這段等待時(shí)間比較長(zhǎng)，為了提高用戶體驗(yàn)度，我們通常會(huì)給出 “正在處理，請(qǐng)稍等！”諸如此類的提示。我們可通過設(shè)置$.ajax()下的參數(shù)beforeSend()來實(shí)現(xiàn)，
eg:
html關(guān)鍵代碼

<div id="warning"></div>

js文件中的關(guān)鍵代碼

$.ajax(function(){
.
.
.
//省略了一些參數(shù)，這里只給出async 和 beforeSend
async: false, //同步請(qǐng)求，默認(rèn)情況下是異步（true）
beforeSend: function(){
$('#warning').text('正在處理，請(qǐng)稍等！');
}
});

注意，如果你按照同步設(shè)置 async: false, $('#warning').text('正在處理，請(qǐng)稍等！');在網(wǎng)頁中根本沒有出現(xiàn)效果，如果將$('#warning').text('正在處理，請(qǐng)稍等！');換成 alert（‘test'）；在發(fā)送請(qǐng)求前會(huì)立即看到彈出框，這說明 beforeSend:是執(zhí)行了，但是換成別的諸如 $('#warning').text('正在處理，請(qǐng)稍等！'); 在請(qǐng)求發(fā)出返回結(jié)果了都沒有看到提示出現(xiàn)。關(guān)于這個(gè)問題，我是納悶了很久，問題到底是什么我還是不清楚。
把同步請(qǐng)求改成異步請(qǐng)求，上面的問題就沒有了，

beforeSend: function(){
$('#warning').text('正在處理，請(qǐng)稍等！');
}

會(huì)立即被執(zhí)行。

最新評(píng)論