本文實(shí)例講述了asp.net+ajax的Post請(qǐng)求的實(shí)現(xiàn)方法。分享給大家供大家參考。具體如下:
復(fù)制代碼 代碼如下:
//一個(gè)ajax的Post請(qǐng)求
function submitInfo() {
$(".warn").hide(); //剛提交的時(shí)候隱藏錯(cuò)誤的信息
var data = $("#formData").serialize(); //將表單的數(shù)據(jù)通過(guò)序列化表單值,創(chuàng)建 URL 編碼文本字符串。形成一個(gè)表單元素集合的 jQuery 對(duì)象
$.post("/login/checkLoginInfo", data, function (ajaxObj) { //將數(shù)據(jù)提交到login控制器下的CheckLOginInfo方法。參數(shù)是data。 如果請(qǐng)求成功,function就是請(qǐng)求成功時(shí)執(zhí)行的回調(diào)函數(shù)。ajaxObj是checkLoginInfo方法的返回?cái)?shù)據(jù)
//回傳內(nèi)容{status: 1(success)/0(fail),}
if (ajaxObj.status == 0 || status == null) { //如果返回狀態(tài)為0或者為null
$(".warn").show(); //將錯(cuò)誤信息顯示出來(lái)
} else {
//登陸成功,跳轉(zhuǎn)都制定頁(yè)面
window.location = '/HotelList/Index';
}
}, "json");
}
注意這條語(yǔ)句的參數(shù),與回調(diào)函數(shù) loginFinish 與上面條$.Post()請(qǐng)求的區(qū)別
復(fù)制代碼 代碼如下:
$.post("/ajax/UserLogin.ashx",
{ "username": username, "password": password },
loginFinish);
復(fù)制代碼 代碼如下:
html xmlns="http://www.w3.org/1999/xhtml">
head runat="server">
title>/title>
link href="/css/ui-lightness/jquery-ui-1.8.2.custom.css" rel="stylesheet" type="text/css" />
script src="/js/jquery-1.4.2.js" type="text/javascript">/script>
script src="/js/jquery-ui-1.8.2.custom.js" type="text/javascript">/script>
script type="text/javascript">
//向服務(wù)器請(qǐng)求當(dāng)前登錄狀態(tài),然后切換登錄區(qū)域的顯示
var checkLogin = function () {
$.post("/ajax/CheckLogin.ashx", function (data) {
var strs = data.split("|");
if (strs[0] == "no") {
//alert("木有登陸");
$("#divLoginArea").show(); //如果沒(méi)有登陸就顯示"登陸"
$("#divLoginOutArea").hide(); //隱藏"注銷(xiāo)"
}
else {
//切換“登錄”、“注銷(xiāo)”的兩個(gè)層
$("#divLoginArea").hide(); //隱藏"登陸"
$("#divLoginOutArea").show(); //顯示 "注銷(xiāo)"
$("#spanUserName").text(strs[1]);//把當(dāng)前登錄用戶(hù)名顯示出來(lái)
}
});
}
var loginFinish = function (data) { //這是一個(gè)回調(diào)函數(shù)
if (data == "ok") {
//alert("成功");
$("#divLogin").dialog("close"); //登錄成功關(guān)閉窗口
checkLogin();//登錄成功,刷新登錄區(qū)域的顯示
}
else {
alert("用戶(hù)名密碼錯(cuò)誤");
}
};
$(function () {
$("#btnShowLoginDlg").click(function () {
$("#divLogin").dialog({
height: 200,
modal: true
});
});
$("#btnLogin").click(function () { //當(dāng)用戶(hù)點(diǎn)擊"登陸" 控件觸發(fā)事件
//todo:檢驗(yàn)用戶(hù)名、密碼不能為空
var username = $("#txtUserName").val();
var password = $("#txtPwd").val();
$.post("/ajax/UserLogin.ashx",//----------------------請(qǐng)關(guān)注這條$.Post()請(qǐng)求的參數(shù)與回調(diào)函數(shù)
{ "username": username, "password": password },
loginFinish);
});
});
$(function () {
checkLogin();//剛進(jìn)入頁(yè)面的時(shí)候也是先向服務(wù)器查詢(xún)當(dāng)前登錄狀態(tài)
$("#btnLogout").click(function () {
$.post("/ajax/Logout.ashx", function () {
checkLogin();//刷新顯示
});
});
});
/script>
asp:ContentPlaceHolder ID="head" runat="server">
/asp:ContentPlaceHolder>
/head>
body>
form id="form1" runat="server">
div>
div id="divLoginArea" style="display:none">input type="button" value="登錄" id="btnShowLoginDlg" />/div>
div id="divLoginOutArea" style="display:none">
span id="spanUserName">/span>
input type="button" value="注銷(xiāo)" id="btnLogout" />
/div>
div id="divLogin" title="登錄窗口" style="display:none">
table>
tr>td>用戶(hù)名:/td>td>input type="text" id="txtUserName"/>/td>/tr>
tr>td>密碼:/td>td>input type="password" id="txtPwd"/>/td>/tr>
tr>td colspan="2">input type="button" value="登錄" id="btnLogin" />/td>/tr>
/table>
/div>
br />
asp:ContentPlaceHolder ID="placeHolderMain" runat="server">
/asp:ContentPlaceHolder>
br />
尾部br />
/div>
/form>
/body>
/html>
希望本文所述對(duì)大家的asp.net程序設(shè)計(jì)有所幫助。
您可能感興趣的文章:- Ajax post請(qǐng)求跳轉(zhuǎn)頁(yè)面
- 使用jQuery的ajax方法向服務(wù)器發(fā)出get和post請(qǐng)求的方法
- Servlet獲取AJAX POST請(qǐng)求中參數(shù)以form data和request payload形式傳輸?shù)姆椒?/li>
- Node.js如何響應(yīng)Ajax的POST請(qǐng)求并且保存為JSON文件詳解
- 深入理解Ajax的get和post請(qǐng)求
- 防止頁(yè)面url緩存中ajax中post請(qǐng)求的處理方法
- Jquery中$.post和$.ajax的用法小結(jié)
- ajax中g(shù)et和post的說(shuō)明及使用與區(qū)別
- php采用ajax數(shù)據(jù)提交post與post常見(jiàn)方法總結(jié)
- Jquery AJAX POST與GET之間的區(qū)別
- php AJAX POST的使用實(shí)例代碼
- Ajax提交post請(qǐng)求案例分析