小編給大家分享一下ajax如何實(shí)時(shí)刷新處理,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
我們提供的服務(wù)有:成都做網(wǎng)站、網(wǎng)站制作、微信公眾號(hào)開發(fā)、網(wǎng)站優(yōu)化、網(wǎng)站認(rèn)證、潮陽(yáng)ssl等。為上1000家企事業(yè)單位解決了網(wǎng)站和推廣的問(wèn)題。提供周到的售前咨詢和貼心的售后服務(wù),是有科學(xué)管理、有技術(shù)的潮陽(yáng)網(wǎng)站制作公司前端渲染頁(yè)面拿數(shù)據(jù),無(wú)非就是ajax、socket,其他的暫時(shí)沒(méi)有用過(guò),但項(xiàng)目還是使用ajax比較多。
下面來(lái)看一下一個(gè)簡(jiǎn)單基于ajax短輪詢的請(qǐng)求
function req() { $.ajax({ type: 'get', url: 'demo.php', dataType: 'json', success: function(res) { console.log(res); }, error: function() { console.log('請(qǐng)求失敗~'); } }); } req(); setInterval(req, 3000);
如果網(wǎng)速快而穩(wěn)定的話,可以這樣使用,但網(wǎng)速誰(shuí)能確定呢,如果網(wǎng)速不穩(wěn)定的話,請(qǐng)求一個(gè)接口需要5~10秒,這樣就會(huì)造成ajax請(qǐng)求堆積,近而引發(fā)不可估量的問(wèn)題,那么怎樣去避免這個(gè)問(wèn)題呢?
方式一:給請(qǐng)求賦上一個(gè)變量,然后每次輪詢先abort掉上一個(gè)請(qǐng)求
var ajaxReq = null; function req(isLoading) { if(ajaxReq !== null) { ajaxReq.abort(); ajaxReq = null; } ajaxReq = $.ajax({ type: 'get', url: 'demo.php', dataType: 'json', beforeSend: function() { if(isLoading) { $('.zh-loading').show(); } }, success: function(res) { console.log(res); }, complete: function() { if(isLoading) { $('.zh-loading').hide(); } }, error: function() { console.log('請(qǐng)求失敗~'); } }); } req(true); setInterval(function() { req(false); }, 3000);
猛一看,感覺(jué)還行,差不多就OK了,但作為前端的我們要不斷的去尋找更合適的方式,所以有個(gè)下面這個(gè)。
方式二:每一次輪詢都判斷上一次請(qǐng)求是否完成,完成了才會(huì)執(zhí)行下一次的請(qǐng)求(推薦)
var isLoaded = false; function req(opts) { $.ajax({ type: 'get', url: 'demo.php', dataType: 'json', beforeSend: function() { if(opts.init === 1) { $('.zh-loading').show(); } isLoaded = false; }, success: function(res) { console.log(res); }, complete: function() { if(opts.init === 1) { $('.zh-loading').hide(); } isLoaded = true; }, error: function() { console.log('請(qǐng)求失敗~'); } }); } req({"init": 1}); setInterval(function() { isLoaded && req({"init": 0}); }, 3000);
上面的isLoaded && req({"init": 0});
表示前面一個(gè)條件正確,則執(zhí)行&&后面的方法
正常的寫法是
if(isLoaded) req({"init": 0});
另外注意一點(diǎn):isLoaded=true
要在complete里加,如果只在success里加的話, 請(qǐng)求失敗了就不會(huì)輪詢?cè)僬?qǐng)求了。complete不管success或error都會(huì)執(zhí)行
代碼就到這里了,thank you for attention~
以上是“ajax如何實(shí)時(shí)刷新處理”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對(duì)大家有所幫助,如果還想學(xué)習(xí)更多知識(shí),歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!
新聞標(biāo)題:ajax如何實(shí)時(shí)刷新處理-創(chuàng)新互聯(lián)
網(wǎng)頁(yè)路徑:http://bm7419.com/article14/diccde.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供云服務(wù)器、手機(jī)網(wǎng)站建設(shè)、ChatGPT、移動(dòng)網(wǎng)站建設(shè)、網(wǎng)站排名、用戶體驗(yàn)
聲明:本網(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í)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容