您好,登錄后才能下訂單哦!
這篇文章主要介紹jQuery基于ajax如何實(shí)現(xiàn)頁(yè)面加載后檢查用戶登錄狀態(tài),文中介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們一定要看完!
本文實(shí)例講述了jQuery基于ajax實(shí)現(xiàn)頁(yè)面加載后檢查用戶登錄狀態(tài)的方法。分享給大家供大家參考,具體如下:
擁有會(huì)員功能的網(wǎng)站,如果會(huì)員已經(jīng)登錄,那么要顯示相應(yīng)的登錄狀態(tài),而且這種顯示的需求是在網(wǎng)站的每個(gè)頁(yè)面都有的(目前國(guó)內(nèi)網(wǎng)站貌似都是這么做的,還沒(méi)有見(jiàn)過(guò)其他形式的狀態(tài)顯示方式),這樣,在打開(kāi)一個(gè)新的頁(yè)面時(shí)就要知道這個(gè)會(huì)員是否已經(jīng)登錄,需要判斷登錄的狀態(tài)。
1、解決方案。
為了能夠?qū)崿F(xiàn)在每一個(gè)頁(yè)面判斷會(huì)員登錄狀態(tài)的功能,我采用了頁(yè)面時(shí)通過(guò)ajax傳遞參數(shù)通過(guò)后端返回的登錄狀態(tài)結(jié)果進(jìn)行判斷,當(dāng)然,這種方式實(shí)現(xiàn)的前提是登錄狀態(tài)在后端可以保持或者能夠查詢到并且不利用頁(yè)面向后端發(fā)送特別參數(shù)。
2、代碼部分。
(1)html部分
<div id="state_content"></div>
(2)jquery部分
jQuery(document).ready(function () { getUserData(); }); function getUserData() { var Option = { url: encodeURI('/Handler/AuthAccounts.ashx?action=getloginstate'), type: "post", dataType: 'text', cache: false, //設(shè)置為 false 將不會(huì)從瀏覽器緩存中加載請(qǐng)求信息。 async: true, //(默認(rèn): true),所有請(qǐng)求均為異步請(qǐng)求。發(fā)送同步請(qǐng)求,請(qǐng)將此選項(xiàng)設(shè)置為 false。同步請(qǐng)求將鎖住瀏覽器,用戶其它操作必須等待請(qǐng)求完成才可以執(zhí)行。 timeout: 150000, //設(shè)置請(qǐng)求超時(shí)時(shí)間(毫秒)。此設(shè)置將覆蓋全局設(shè)置。 error: function () { }, success: function (data, textStatus) { if (data == null || data == undefined) { return false; } jsondata = eval('(' + data + ')'); if (jsondata.state == "success") { var weburl = '<a class="username">歡迎你,' + jsondata.message.split('|')[1] + '</a><a class="go_out" onclick="ExitLoginState()">退出</a>'; $("#state_content").html(weburl); //內(nèi)容 } else { var textList = '<a href="/Login/index.shtml" rel="external nofollow" rel="external nofollow" >【登錄】</a><a href="/Register/index.shtml" rel="external nofollow" rel="external nofollow" >【注冊(cè)】</a>'; $("#state_content").html(textList); //內(nèi)容 } }, beforeSend: function () { } }; jQuery.ajax(Option); return false; } function ExitLoginState() { var Option = { url: encodeURI('/Handler/AuthAccounts.ashx?action=exitloginstate'), type: "post", dataType: 'text', cache: false, //設(shè)置為 false 將不會(huì)從瀏覽器緩存中加載請(qǐng)求信息。 async: true, //(默認(rèn): true),所有請(qǐng)求均為異步請(qǐng)求。發(fā)送同步請(qǐng)求,請(qǐng)將此選項(xiàng)設(shè)置為 false。同步請(qǐng)求將鎖住瀏覽器,用戶其它操作必須等待請(qǐng)求完成才可以執(zhí)行。 timeout: 150000, //設(shè)置請(qǐng)求超時(shí)時(shí)間(毫秒)。此設(shè)置將覆蓋全局設(shè)置。 error: function () { }, success: function (data, textStatus) { if (data == null || data == undefined) { return false; } jsondata = eval('(' + data + ')'); if (jsondata.state == "success") { alert("已經(jīng)退出"); var textList = '<a href="/Login/index.shtml" rel="external nofollow" rel="external nofollow" >【登錄】</a><a href="/Register/index.shtml" rel="external nofollow" rel="external nofollow" >【注冊(cè)】</a>'; $("#state_content").html(textList); //內(nèi)容 } }, beforeSend: function () { } }; jQuery.ajax(Option); return false; }
jquery是一個(gè)簡(jiǎn)潔而快速的JavaScript庫(kù),它具有獨(dú)特的鏈?zhǔn)秸Z(yǔ)法和短小清晰的多功能接口、高效靈活的css選擇器,并且可對(duì)CSS選擇器進(jìn)行擴(kuò)展、擁有便捷的插件擴(kuò)展機(jī)制和豐富的插件,是繼Prototype之后又一個(gè)優(yōu)秀的JavaScript代碼庫(kù),能夠用于簡(jiǎn)化事件處理、HTML文檔遍歷、Ajax交互和動(dòng)畫(huà),以便快速開(kāi)發(fā)網(wǎng)站。
以上是“jQuery基于ajax如何實(shí)現(xiàn)頁(yè)面加載后檢查用戶登錄狀態(tài)”這篇文章的所有內(nèi)容,感謝各位的閱讀!希望分享的內(nèi)容對(duì)大家有幫助,更多相關(guān)知識(shí),歡迎關(guān)注億速云行業(yè)資訊頻道!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。