因为工作需要研究了一下 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 cellspacing="0" cellpadding="0">
<tr>
<td valign="middle">用户名：</td>
<td valign="middle">
<input type="text"/>
</td>
</tr>
<tr>
<td valign="middle">密 码：</td>
<td valign="middle">
<input type="password"/>
</td>
</tr>
<!--<tr>
<td valign="middle">验证码：</td>
<td valign="middle">
<input type="text"/>
<span><img src="https://www.jb51.net/images/img_7.gif" /></span></td>
</tr>-->
<tr>
<td colspan="2">
<input type="image" src="https://www.jb51.net/images/img_4.gif" />
<input type="image" src="https://www.jb51.net/images/img_5.gif" />
<input type="image" src="https://www.jb51.net/images/img_6.gif" />
</td>
</tr>
</table>
三、后台部分也就是在js中转向的处理登录信息的页面
复制代码 代码如下: