jQuery基于ajax實現(xiàn)頁面加載后檢查用戶登錄狀態(tài)的方法
本文實例講述了jQuery基于ajax實現(xiàn)頁面加載后檢查用戶登錄狀態(tài)的方法。分享給大家供大家參考，具體如下：
擁有會員功能的網(wǎng)站，如果會員已經(jīng)登錄，那么要顯示相應(yīng)的登錄狀態(tài)，而且這種顯示的需求是在網(wǎng)站的每個頁面都有的（目前國內(nèi)網(wǎng)站貌似都是這么做的，還沒有見過其他形式的狀態(tài)顯示方式），這樣，在打開一個新的頁面時就要知道這個會員是否已經(jīng)登錄，需要判斷登錄的狀態(tài)。
1、解決方案。
為了能夠?qū)崿F(xiàn)在每一個頁面判斷會員登錄狀態(tài)的功能，我采用了頁面時通過ajax傳遞參數(shù)通過后端返回的登錄狀態(tài)結(jié)果進(jìn)行判斷，當(dāng)然，這種方式實現(xiàn)的前提是登錄狀態(tài)在后端可以保持或者能夠查詢到并且不利用頁面向后端發(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 將不會從瀏覽器緩存中加載請求信息。
async: true, //(默認(rèn): true)，所有請求均為異步請求。發(fā)送同步請求，請將此選項設(shè)置為 false。同步請求將鎖住瀏覽器，用戶其它操作必須等待請求完成才可以執(zhí)行。
timeout: 150000, //設(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" >【注冊】</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 將不會從瀏覽器緩存中加載請求信息。
async: true, //(默認(rèn): true)，所有請求均為異步請求。發(fā)送同步請求，請將此選項設(shè)置為 false。同步請求將鎖住瀏覽器，用戶其它操作必須等待請求完成才可以執(zhí)行。
timeout: 150000, //設(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" >【注冊】</a>';
$("#state_content").html(textList); //內(nèi)容
}
},
beforeSend: function ()
{
}
};
jQuery.ajax(Option);
return false;
}
更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《jquery中Ajax用法總結(jié)》、《jQuery操作json數(shù)據(jù)技巧匯總》、《jQuery form操作技巧匯總》、《jQuery常用插件及用法總結(jié)》、《jQuery擴展技巧總結(jié)》、《jQuery表格(table)操作技巧匯總》及《jquery選擇器用法總結(jié)》
希望本文所述對大家jQuery程序設(shè)計有所幫助。
相關(guān)文章
jQuery插入節(jié)點和移動節(jié)點用法示例(insertAfter、insertBefore方法)
這篇文章主要介紹了jQuery插入節(jié)點和移動節(jié)點的方法,結(jié)合實例形式分析了insertAfter和insertBefore方法針對頁面元素節(jié)點操作的使用技巧,需要的朋友可以參考下2016-09-09
jQuery 的插件 dataTables 是一個優(yōu)秀的表格插件，提供了針對表格的排序、瀏覽器分頁、服務(wù)器分頁、篩選、格式化等功能。接下來通過本文給大家介紹jQuery插件datatables使用教程，感興趣的朋友一起學(xué)習(xí)吧2016-04-04
easyui datagrid 表格中操作欄 按鈕圖標(biāo)不顯示的解決方法
解析Jquery的LigerUI如何實現(xiàn)文件上傳
input 輸入框獲得/失去焦點時隱藏/顯示文字(jquery版)