asp.net利用jquery ajax实现免刷新登录

一、js部分友情提示注意js部分中的 $("#btn_login")中的return false；这个可以阻止回转服务器不然还是会刷新

View Code

 1 $(document).ready(function () {
 2 
 3     $("#btn_login").click(function () {
 4 
 5         postlogin();
 6 
 7         return false;
 8 
 9     });
10 
11 });
12 
13  
14 
15  
16 
17 function postlogin() {
18 
19     if (checkUserName() && checkUserPwd()) {
20 
21         var username = $('#txt_loginname').val();
22 
23         var userpass = $('#txt_loginpass').val();
24 
25         $.post("../UserLogin.aspx", { UserName: username, UserPass: userpass }, function (result) {
26 
27             if (result == "1") {
28 
29                 alert("登录成功！");
30 
31             } else if (result == "3") {
32 
33                 alert("用户名不正确!");
34 
35             } else if (result == "2") {
36 
37                 alert("密码不正确!");
38 
39             } else {
40 
41                 alert("登录失败!请重试!" + result);
42 
43             }
44 
45         });
46 
47     }
48 
49 }
50 
51  
52 
53 function checkUserName() {
54 
55     if ($("#txt_loginname").val().length == 0) {
56 
57         alert('用户名不能为空!');
58 
59         return false;
60 
61     } else {
62 
63         return true;
64 
65     }
66 
67 }
68 
69  
70 
71 function checkUserPwd() {
72 
73     if ($("#txt_loginpass").val().lenght == 0) {
74 
75         alert('密码不正确!');
76 
77         return false;
78 
79     } else {
80 
81         return true;
82 
83     }
84 
85 }

二、页面部分

View Code

 1 <table width="100%" border="0" cellspacing="0" cellpadding="0">
 2 
 3           <tr>
 4 
 5             <td width="32%" height="37" valign="middle">用户名：</td>
 6 
 7             <td width="68%" valign="middle">
 8 
 9                 <input type="text" name="txt_loginname" id="txt_loginname" class="input_1"/>
10 
11             </td>
12 
13           </tr>
14 
15           <tr>
16 
17             <td height="37" valign="middle">密　码：</td>
18 
19             <td valign="middle">
20 
21             <input type="password" name="txt_loginpass" id="txt_loginpass" class="input_2"/>
22 
23             </td>
24 
25           </tr>
26 
27           <!--<tr>
28 
29             <td height="37" valign="middle">验证码：</td>
30 
31             <td valign="middle">
32 
33               <input type="text" name="textfield3" id="textfield3" class="input_3" style="float:left"/>
34 
35               <span style="float:left; margin-left:6px;"><img src="images/img_7.gif" /></span></td>
36 
37           </tr>-->
38 
39           <tr>
40 
41             <td colspan="2">
42 
43               <input type="image" name="btn_login" id="btn_login" src="images/img_4.gif" />
44 
45               <input type="image" name="input" src="images/img_5.gif" />
46 
47                <input type="image" name="input" src="images/img_6.gif" />
48 
49             </td>
50 
51           </tr>
52 
53         </table>

三、后台部分也就是在js中转向的处理登录信息的页面

View Code

 1 protected void Page_Load(object sender, EventArgs e)
 2 
 3         {
 4 
 5             string username = Request.Form["UserName"];
 6 
 7             string userpass = Request.Form["UserPass"];
 8 
 9             T_User user = UserManager.loginpassword(username, userpass);
10 
11             if (user != null)
12 
13             {
14 
15                 Session["user"] = user;
16 
17                 Response.Write("1");  //登录成功
18 
19                 Response.End();
20 
21  
22 
23             }
24 
25             else
26 
27             {
28 
29                 if (UserManager.OnlyOne(username) >= 1)
30 
31                 {
32 
33                     Response.Write("2");  //密码不正确
34 
35                     Response.End();
36 
37                 }
38 
39                 else
40 
41                 {
42 
43                     Response.Write("3");  //用户名不存在
44 
45                     Response.End();
46 
47                 }
48 
49             }
50 
51         }