获取前台页面中的值,将获取到的值传到后台,做简单的登录验证(不与数据库关联)
时间:2022-03-14 03:38
思路:利用jQuery的AJAX
前台代码:
1 <body> 2 <form id="form1" runat="server"> 3 <div> 4 <table> 5 <tr> 6 <td>用户名:</td> 7 <td> 8 <input type="text" id="name" name="Username" /> 9 </td> 10 </tr> 11 <tr> 12 <td>密码:</td> 13 <td> 14 <input type="password" id="pwd" name="Userpwd" /> 15 </td> 16 </tr> 17 <tr> 18 <td> 19 <input type="button" id="btnOk" value="登录"/> 20 </td> 21 </tr> 22 </table> 23 </div> 24 </form> 25 </body>
AJAX代码:
1 //AJAX的前台是空页面 2 $(document).ready(function () { 3 //给前台页面上的标签绑定一个click事件,写一个方法 4 $("#btnOk").bind("click", function () { 5 //取前台页面输入的数据 6 var Username = document.getElementById("name").value; 7 var Userpwd = document.getElementById("pwd").value; 8 $.ajax({ 9 url: "LoginBackstage.aspx", 10 type: "POST", 11 data: "UserName=" + Username + "&UserPwd=" + Userpwd + "", 12 error: function () { 13 alert("error"); 14 }, 15 success: function (da) { 16 var flag = da.toString(); 17 if (flag == 1) { 18 self.location = ‘Main.aspx‘; 19 } 20 } 21 }); 22 }); 23 });
在AJAX空页面的后台的Page_Load中写后台代码,做登录验证
1 protected void Page_Load(object sender, EventArgs e) 2 { 3 //登录验证 4 string username = Request["UserName"]; 5 string userpwd = Request["UserPwd"]; 6 7 int flag = 0; 8 try 9 { 10 if (username == "张三" && userpwd == "1001") 11 { 12 flag = 1; 13 Response.Write(flag.ToString()); 14 15 } 16 } 17 catch (Exception ex) 18 { 19 20 throw ex; 21 } 22 }