如何基於Ajax技術實現無刷新用戶登錄功能?

ADVERTISEMENT

如何基於Ajax技術實現無刷新用戶登錄功能?

代碼如下:


 // JScript 文件
 function usersLogon()
 {
 var userName = document.getElementById("txtuserName").value;
 var password = document.getElementById("txtpassword").value;
 var checkCode = document.getElementById("txtCheckCode").value;
 
 var response = userControl_logon.CheckCodeIsRight(checkCode).value;
 
 if(userName == "")
 {
 document.getElementById("txtuserName").focus();
 return false;
 }
 else if(password == "")
 {
 document.getElementById("txtpassword").focus();
 return false;
 }
 else if(checkCode =="")
 {
 document.getElementById("txtCheckCode").focus();
 return false;
 }
 else
 {
 if(response == true)
 {
 //判斷用戶是否存在
 userControl_logon.userNameAndPasswordIsExist(userName,password,userNameIsRight);
 }
 else
 {
 alert("驗證碼出錯");
 userControl_logon.checkCodeOperaotr(refreshCheckCode);
 document.getElementById("txtpassword").value = "";
 }
 } 
 }
 function userNameIsRight(res)
 {
 var userName = document.getElementById("txtuserName").value;
 if(res.value == true)
 {
 //用戶存在,但要看此用戶有沒有進入管理留言版權限,
 userControl_logon.userNameIsRight(userName,CallBack);
 }
 else
 {
 alert("用戶名或密碼錯誤");
 document.getElementById("txtpassword").value = "";
 OnLoad_checkCode();
 }
 }
 function CallBack(res)
 {
 if(res.value == true)
 {
 hideLogon();
 var url = userControl_logon.returnUrl();
 if ( url.value == 404)
 {
 showDefault();
 }
 else
 {
 document.getElementById("Url").innerHTML = '<a href="' + url.value + '">' + url.value + '</a>'
 }
 }
 else
 {
 alert("對不起你的權限不夠");
 document.getElementById("txtpassword").value = "";
 OnLoad_checkCode();
 }
 }
 //隱藏登錄框
 function hideLogon()
 {
 var element = document.getElementById("hideLogon")
 element.style.display = "none"
 
 }
 //顯示返回首頁
 function showDefault()
 {
 var element = document.getElementById("Returndefault")
 element.style.display = "block" 
 }
 function OnLoad_checkCode()
 {
 userControl_logon.checkCodeOperaotr(refreshCheckCode);
 document.getElementById("txtuserName").focus();
 // return false;
 }
 ///重新得到新的驗證嗎
 function refreshCheckCode(res)
 { 
 document.getElementById("txtCheckCode").value = "";
 document.getElementById("lblNumber").innerHTML = res.value;
 }
 function abce()
 {
 alert(document.getElementById("lblNumber").value)
 }
ADVERTISEMENT

下面代碼


 using System;
 using System.Data;
 using System.Configuration;
 using System.Collections;
 using System.Web;
 using System.Web.Security;
 using System.Web.UI;
 using System.Web.UI.WebControls;
 using System.Web.UI.WebControls.WebParts;
 using System.Web.UI.HtmlControls;
 using System.Drawing;
 using LHB_SQL_2005;
 
 public partial class userControl_logon : System.Web.UI.UserControl
 {
 protected void Page_Load(object sender, EventArgs e)
 {
 if (!this.IsPostBack)
 {
 AjaxPro.Utility.RegisterTypeForAjax(typeof(userControl_logon));
 }
 }
 
 [AjaxPro.AjaxMethod]
 public static string checkCodeOperaotr()
 {
 string _checkCode = GeneralMethod.GenerateCheckCode();
 System.Web.HttpContext.Current.Session["checkCode"] = _checkCode;
 //返回驗證碼
 return _checkCode;
 }
 
 /// <summary>
 /// 判斷驗證是否正確
 /// </summary>
 /// <param name="checkCode"></param>
 /// <returns></returns>
 [AjaxPro.AjaxMethod]
 public static bool CheckCodeIsRight(string checkCode)
 {
 string _checkCode = (string)(System.Web.HttpContext.Current.Session["checkCode"]); 
 if (_checkCode == checkCode)
 {
 return true;
 }
 else
 {
 return false;
 }
 }
 /// <summary>
 /// 判斷用戶名及密碼添加是否正確
 /// </summary>
 /// <param name="userName">用戶名</param>
 /// <param name="_password">用戶名密碼</param>
 /// <returns>bool</returns>
 [AjaxPro.AjaxMethod]
 public static bool userNameAndPasswordIsExist(string userName, string _password)
 {
 string password = GeneralMethod.ToEncryptPassword(_password);
 string executeString = "SELECT COUNT(*) FROM users WHERE userName = '" + userName.ToString() + "' AND password = '" + password + "'";
 int count = int.Parse(GetCommand.ExecuteScalar(executeString));
 if (count == 1)
 {
 System.Web.HttpContext.Current.Session["userName"] = userName;
 return true;
 }
 else
 {
 return false;
 }
 }
 
 /// <summary>
 /// 判斷用戶是不是有這進入管理留言版的權限
 /// </summary>
 /// <param name="userName">用戶名</param>
 /// <returns></returns>
 [AjaxPro.AjaxMethod]
 public static bool userNameIsRight(string userName)
 {
 string executeString = "SELECT [right] FROM role WHERE usersId = (select userNameId from users where userName = '" + userName + "')";
 int count = int.Parse(GetCommand.ExecuteScalar(executeString));
 if (count > 0)
 {
 return true;
 }
 else
 {
 return false;
 }
 }
 
 /// <summary>
 /// 返回Url值
 /// </summary>
 /// <returns></returns>
 [AjaxPro.AjaxMethod]
 public static string returnUrl()
 {
 string url = "";
 try
 {
 url = System.Web.HttpContext.Current.Session["url"].ToString();
 }
 catch
 {
 url ="404";
 }
 return url;
 }
 }

下面是頁面代碼


 <%@ Control Language="C#" AutoEventWireup="true" CodeFile="logon.ascx.cs" Inherits="userControl_logon" %>
 <script language="javascript" type="text/javascript" src="../JavaScript/logon.js">
 </script>
 <script language="javascript" type="text/javascript" src="JavaScript/logon.js">
 </script>
 <link href="../CSS/table_css.css" rel="stylesheet" type="text/css" />
 <link href="CSS/table_css.css" rel="stylesheet" type="text/css" />
 <body onload="OnLoad_checkCode();">
 <div>
 <table border="0" cellpadding="0" cellspacing="0">
 <tr>
 <td>
 <table id="hideLogon" border="0" cellpadding="0" cellspacing="0" style="display:block;">
 <tr>
 <td style="background-color: #99ccff">用戶名:</td>
 <td><input type="text" id="txtuserName" style="width: 105px" /></td>
 </tr>
 <tr>
 <td style="background-color: #99ccff">密 碼:</td>
 <td>
 <input id="txtpassword" type="password" style="width: 105px" /></td>
 </tr>
 <tr>
 <td style="background-color: #99ccff">驗證碼:</td>
 <td style="background-color: #99ccff">
 <input type= "text" id="txtCheckCode" style=" width:60px" /><label id="lblNumber"></label></td>
 </tr>
 <tr>
 <td style="background-color: #99ccff"></td>
 <td style="background-color: #99ccff">
 <input type="button" onclick="usersLogon();" value="登錄" id="btnLogon" /></td>
 </tr>
 </table>
 </td>
 </tr>
 <tr>
 <td >
 <div id="Url"></div>
 </td>
 </tr>
 <tr>
 <td align="center">
 <table id="Returndefault" border="0" cellpadding="0" cellspacing="0" style="display:none;">
 <tr>
 <td>
 <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="~/Default.aspx">返回首頁</asp:HyperLink></td>
 </tr>
 </table>
 </td>
 </tr>
 </table>
 </div>
 </body>

以上所述是小編給大家介紹的基於Ajax技術實現無刷新用戶登錄功能,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回複大家的。在此也非常感謝大家對路飯網站的支持!

ADVERTISEMENT

本文地址:
ADVERTISEMENT
ADVERTISEMENT