如何用Ajax的beforeSend提高用戶體驗(yàn),相信很多沒有經(jīng)驗(yàn)的人對(duì)此束手無策,為此本文總結(jié)了問題出現(xiàn)的原因和解決方法,通過這篇文章希望你能解決這個(gè)問題。
專注于為中小企業(yè)提供網(wǎng)站設(shè)計(jì)、成都網(wǎng)站設(shè)計(jì)服務(wù),電腦端+手機(jī)端+微信端的三站合一,更高效的管理,為中小企業(yè)寶山免費(fèi)做網(wǎng)站提供優(yōu)質(zhì)的服務(wù)。我們立足成都,凝聚了一批互聯(lián)網(wǎng)行業(yè)人才,有力地推動(dòng)了超過千家企業(yè)的穩(wěn)健成長,幫助中小企業(yè)通過網(wǎng)站建設(shè)實(shí)現(xiàn)規(guī)模擴(kuò)充和轉(zhuǎn)變。
jQuery是經(jīng)常使用的一個(gè)開源js框架,其中的$.ajax請(qǐng)求中有一個(gè)beforeSend方法,用于在向服務(wù)器發(fā)送請(qǐng)求前執(zhí)行一些動(dòng)作。
$.ajax({ beforeSend:function(){ // handle the beforeSend event }, complete:function(){ // handle the complete event } });
防止重復(fù)數(shù)據(jù)
在實(shí)際項(xiàng)目開發(fā)中,提交表單時(shí)常常由于網(wǎng)絡(luò)或者其原因,用戶點(diǎn)擊提交按鈕誤認(rèn)為自己沒有操作成功,進(jìn)而會(huì)重復(fù)提交按鈕操作次數(shù),如果頁面前端代碼沒有做一些相應(yīng)的處理,通常會(huì)導(dǎo)致多條同樣的數(shù)據(jù)插入數(shù)據(jù)庫,導(dǎo)致臟數(shù)據(jù)的增加。要避免這種現(xiàn)象,在$.ajax請(qǐng)求中的beforeSend方法中把提交按鈕禁用掉,等到Ajax請(qǐng)求執(zhí)行完畢,在恢復(fù)按鈕的可用狀態(tài)。
舉個(gè)例子:
$.ajax({ type:"post", data:studentInfo, contentType:"application/json", url:"/Home/Submit", beforeSend:function(){ //禁用按鈕防止重復(fù)提交 $("#submit).attr({disabled:"disabled"}); }, success:function(data){ if(data=="Success"){ // 清空輸入框 clearBox(); } }, complete:function(){ $("#submit").removeAttr("disabled"); }, error:function(data){ consloe.info("error:"+data.responseText); } });
模擬Toast效果
ajax請(qǐng)求服務(wù)器加載數(shù)據(jù)列表時(shí)提示loading(“加載中,請(qǐng)稍后...”)
$.ajax({ type:"post", contentType:"application/json", url:"/Home/GetList", beforeSend: function(){ $("loading").show(); }, success: function(data){ if (data=="Success"){ // ... } }, error: function(){ console.info("error:"+data.responseText); } });
看完上述內(nèi)容,你們掌握如何用Ajax的beforeSend提高用戶體驗(yàn)的方法了嗎?如果還想學(xué)到更多技能或想了解更多相關(guān)內(nèi)容,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,感謝各位的閱讀!
新聞名稱:如何用Ajax的beforeSend提高用戶體驗(yàn)
文章源于:http://www.rwnh.cn/article4/igpdoe.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供微信公眾號(hào)、移動(dòng)網(wǎng)站建設(shè)、企業(yè)網(wǎng)站制作、搜索引擎優(yōu)化、App設(shè)計(jì)、網(wǎng)站營銷
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)