因為工作需要研究了一下 js的ajax，下面是成果。
主要是三部分：
一、js部分 友情提示注意js部分中的 $("#btn_login")中的return false；這個可以阻止回轉服務器不然還是會刷新
復制代碼 代碼如下:
$(document).ready(function () {
$("#btn_login").click(function () {
postlogin();
return false;
});
});
function postlogin() {
if (checkUserName() checkUserPwd()) {
var username = $('#txt_loginname').val();
var userpass = $('#txt_loginpass').val();
$.post("../UserLogin.aspx", { UserName: username, UserPass: userpass }, function (result) {
if (result == "1") {
alert("登錄成功！");
} else if (result == "3") {
alert("用戶名不正確!");
} else if (result == "2") {
alert("密碼不正確!");
} else {
alert("登錄失敗!請重試!" + result);
}
});
}
}
function checkUserName() {
if ($("#txt_loginname").val().length == 0) {
alert('用戶名不能為空!');
return false;
} else {
return true;
}
}
function checkUserPwd() {
if ($("#txt_loginpass").val().lenght == 0) {
alert('密碼不正確!');
return false;
} else {
return true;
}
}
二、頁面部分
復制代碼 代碼如下:
table width="100%" border="0" cellspacing="0" cellpadding="0">
tr>
td width="32%" height="37" valign="middle">用戶名：/td>
td width="68%" valign="middle">
input type="text" name="txt_loginname" id="txt_loginname" class="input_1"/>
/td>
/tr>
tr>
td height="37" valign="middle">密 碼：/td>
td valign="middle">
input type="password" name="txt_loginpass" id="txt_loginpass" class="input_2"/>
/td>
/tr>
!--tr>
td height="37" valign="middle">驗證碼：/td>
td valign="middle">
input type="text" name="textfield3" id="textfield3" class="input_3" style="float:left"/>
span style="float:left; margin-left:6px;">img src="images/img_7.gif" />/span>/td>
/tr>-->
tr>
td colspan="2">
input type="image" name="btn_login" id="btn_login" src="images/img_4.gif" />
input type="image" name="input" src="images/img_5.gif" />
input type="image" name="input" src="images/img_6.gif" />
/td>
/tr>
/table>
三、后臺部分也就是在js中轉向的處理登錄信息的頁面
復制代碼 代碼如下:
protected void Page_Load(object sender, EventArgs e)
{
string username = Request.Form["UserName"];
string userpass = Request.Form["UserPass"];
T_User user = UserManager.loginpassword(username, userpass);
if (user != null)
{
Session["user"] = user;
Response.Write("1"); //登錄成功
Response.End();
}
else
{
if (UserManager.OnlyOne(username) >= 1)
{
Response.Write("2"); //密碼不正確
Response.End();
}
else
{
Response.Write("3"); //用戶名不存在
Response.End();
}
}
}
您可能感興趣的文章:- jQuery Ajax 實現在html頁面實時顯示用戶登錄狀態
- jQuery+Ajax+PHP彈出層異步登錄效果(附源碼下載)
- jQuery+AJAX實現遮罩層登錄驗證界面（附源碼）
- JQuery+Ajax+Struts2+Hibernate框架整合實現完整的登錄注冊
- PHP+jQuery+Ajax實現用戶登錄與退出
- S2SH整合JQuery+Ajax實現登錄驗證功能實現代碼
- div彈出層的ajax登錄(Jquery版+c#)
- 基于jquery ajax 用戶無刷新登錄方法詳解
- jQuery.ajax 用戶登錄驗證代碼
- jQuery+Ajax用戶登錄功能的實現
- jquery ajax 登錄驗證實現代碼
- jQuery基于ajax實現頁面加載后檢查用戶登錄狀態的方法
