Heim Web-Frontend js-Tutorial Implementierung einer aktualisierungsfreien Benutzeranmeldung basierend auf Ajax-Technologie (mit Code)

Implementierung einer aktualisierungsfreien Benutzeranmeldung basierend auf Ajax-Technologie (mit Code)

Apr 02, 2018 pm 04:34 PM
ajax 刷新 实现

Dieses Mal bringe ich Ihnen die Benutzeranmeldung basierend auf der Ajax-Technologie, um eine Aktualisierungsfreiheit zu erreichen (mit Code). Was sind die Vorsichtsmaßnahmen

zur Implementierung einer Aktualisierungsfreiheit? Benutzeranmeldung basierend auf Ajax-Technologie? Das Folgende ist ein praktischer Fall, schauen wir uns das an.

Der Code lautet wie folgt:
// 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="&#39; + url.value + &#39;">' + 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)
}
Nach dem Login kopieren

Der folgende Code
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;
  }
}
Nach dem Login kopieren

Das Folgende ist der Seitencode
<%@ 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();">
<p>
<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 >
        <p id="Url"></p>
      </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>
</p>
</body>
Nach dem Login kopieren

Ich glaube Sie haben es gemeistert, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Methoden finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

AJAX-Implementierung ohne Aktualisierung der Anmeldung

Zusammenfassung von Ajax, die Anfänger lernen müssen

Das obige ist der detaillierte Inhalt vonImplementierung einer aktualisierungsfreien Benutzeranmeldung basierend auf Ajax-Technologie (mit Code). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Beste grafische Einstellungen
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. So reparieren Sie Audio, wenn Sie niemanden hören können
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Wie man alles in Myrise freischaltet
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Die F5-Aktualisierungstaste funktioniert unter Windows 11 nicht Die F5-Aktualisierungstaste funktioniert unter Windows 11 nicht Mar 14, 2024 pm 01:01 PM

Funktioniert die F5-Taste auf Ihrem Windows 11/10-PC nicht richtig? Die F5-Taste wird normalerweise verwendet, um den Desktop oder Explorer zu aktualisieren oder eine Webseite neu zu laden. Einige unserer Leser haben jedoch berichtet, dass die F5-Taste ihre Computer aktualisiert und nicht richtig funktioniert. Wie aktiviere ich die F5-Aktualisierung in Windows 11? Um Ihren Windows-PC zu aktualisieren, drücken Sie einfach die Taste F5. Auf einigen Laptops oder Desktops müssen Sie möglicherweise die Tastenkombination Fn+F5 drücken, um den Aktualisierungsvorgang abzuschließen. Warum funktioniert die F5-Aktualisierung nicht? Wenn das Drücken der F5-Taste Ihren Computer nicht aktualisiert oder Probleme unter Windows 11/10 auftreten, kann dies daran liegen, dass die Funktionstasten gesperrt sind. Weitere mögliche Ursachen sind die Tastatur oder die F5-Taste

Wie implementiert man die doppelte WeChat-Anmeldung auf Huawei-Mobiltelefonen? Wie implementiert man die doppelte WeChat-Anmeldung auf Huawei-Mobiltelefonen? Mar 24, 2024 am 11:27 AM

Wie implementiert man die doppelte WeChat-Anmeldung auf Huawei-Mobiltelefonen? Mit dem Aufkommen der sozialen Medien ist WeChat zu einem unverzichtbaren Kommunikationsmittel im täglichen Leben der Menschen geworden. Viele Menschen können jedoch auf ein Problem stoßen: Sie können sich gleichzeitig auf demselben Mobiltelefon bei mehreren WeChat-Konten anmelden. Für Huawei-Mobiltelefonbenutzer ist es nicht schwierig, eine doppelte WeChat-Anmeldung zu erreichen. In diesem Artikel wird erläutert, wie eine doppelte WeChat-Anmeldung auf Huawei-Mobiltelefonen erreicht wird. Erstens bietet das EMUI-System, das mit Huawei-Mobiltelefonen geliefert wird, eine sehr praktische Funktion – das doppelte Öffnen von Anwendungen. Durch die doppelte Öffnungsfunktion der Anwendung können Benutzer gleichzeitig

PHP-Programmierhandbuch: Methoden zur Implementierung der Fibonacci-Folge PHP-Programmierhandbuch: Methoden zur Implementierung der Fibonacci-Folge Mar 20, 2024 pm 04:54 PM

Die Programmiersprache PHP ist ein leistungsstarkes Werkzeug für die Webentwicklung, das eine Vielzahl unterschiedlicher Programmierlogiken und Algorithmen unterstützen kann. Unter diesen ist die Implementierung der Fibonacci-Folge ein häufiges und klassisches Programmierproblem. In diesem Artikel stellen wir vor, wie Sie die Fibonacci-Folge mit der Programmiersprache PHP implementieren, und fügen spezifische Codebeispiele bei. Die Fibonacci-Folge ist eine mathematische Folge, die wie folgt definiert ist: Das erste und das zweite Element der Folge sind 1, und ab dem dritten Element ist der Wert jedes Elements gleich der Summe der beiden vorherigen Elemente. Die ersten paar Elemente der Sequenz

So implementieren Sie die WeChat-Klonfunktion auf Huawei-Mobiltelefonen So implementieren Sie die WeChat-Klonfunktion auf Huawei-Mobiltelefonen Mar 24, 2024 pm 06:03 PM

So implementieren Sie die WeChat-Klonfunktion auf Huawei-Mobiltelefonen Mit der Popularität sozialer Software und der zunehmenden Bedeutung von Datenschutz und Sicherheit rückt die WeChat-Klonfunktion allmählich in den Mittelpunkt der Aufmerksamkeit der Menschen. Die WeChat-Klonfunktion kann Benutzern helfen, sich gleichzeitig bei mehreren WeChat-Konten auf demselben Mobiltelefon anzumelden, was die Verwaltung und Nutzung erleichtert. Es ist nicht schwierig, die WeChat-Klonfunktion auf Huawei-Mobiltelefonen zu implementieren. Sie müssen lediglich die folgenden Schritte ausführen. Schritt 1: Stellen Sie sicher, dass die Version Ihres Mobiltelefonsystems und die WeChat-Version den Anforderungen entsprechen. Stellen Sie zunächst sicher, dass die Version Ihres Huawei-Mobiltelefonsystems sowie die WeChat-App auf die neueste Version aktualisiert wurden.

Meistern Sie, wie Golang Möglichkeiten für die Spieleentwicklung eröffnet Meistern Sie, wie Golang Möglichkeiten für die Spieleentwicklung eröffnet Mar 16, 2024 pm 12:57 PM

Im heutigen Bereich der Softwareentwicklung wird Golang (Go-Sprache) als effiziente, prägnante und hochgradig parallele Programmiersprache von Entwicklern zunehmend bevorzugt. Seine umfangreiche Standardbibliothek und die effizienten Parallelitätsfunktionen machen es zu einer hochkarätigen Wahl im Bereich der Spieleentwicklung. In diesem Artikel wird untersucht, wie man Golang für die Spieleentwicklung verwendet, und seine leistungsstarken Möglichkeiten anhand spezifischer Codebeispiele demonstriert. 1. Golangs Vorteile bei der Spieleentwicklung: Als statisch typisierte Sprache wird Golang beim Aufbau großer Spielsysteme verwendet.

Implementierungshandbuch für PHP-Spielanforderungen Implementierungshandbuch für PHP-Spielanforderungen Mar 11, 2024 am 08:45 AM

Implementierungsleitfaden für PHP-Spielanforderungen Mit der Popularität und Entwicklung des Internets erfreut sich der Markt für Webspiele immer größerer Beliebtheit. Viele Entwickler hoffen, die PHP-Sprache zur Entwicklung ihrer eigenen Webspiele nutzen zu können, und die Umsetzung der Spielanforderungen ist ein wichtiger Schritt. In diesem Artikel wird erläutert, wie Sie mithilfe der PHP-Sprache allgemeine Spielanforderungen implementieren und spezifische Codebeispiele bereitstellen. 1. Spielfiguren erstellen In Webspielen sind Spielfiguren ein sehr wichtiges Element. Wir müssen die Attribute des Spielcharakters wie Name, Level, Erfahrungswert usw. definieren und Methoden für deren Bedienung bereitstellen

Wie erhalte ich Variablen aus der PHP-Methode mit Ajax? Wie erhalte ich Variablen aus der PHP-Methode mit Ajax? Mar 09, 2024 pm 05:36 PM

Die Verwendung von Ajax zum Abrufen von Variablen aus PHP-Methoden ist ein häufiges Szenario in der Webentwicklung. Durch Ajax kann die Seite dynamisch abgerufen werden, ohne dass die Daten aktualisiert werden müssen. In diesem Artikel stellen wir vor, wie man Ajax verwendet, um Variablen aus PHP-Methoden abzurufen, und stellen spezifische Codebeispiele bereit. Zuerst müssen wir eine PHP-Datei schreiben, um die Ajax-Anfrage zu verarbeiten und die erforderlichen Variablen zurückzugeben. Hier ist ein Beispielcode für eine einfache PHP-Datei getData.php:

Wie kann das Problem des jQuery AJAX-Fehlers 403 gelöst werden? Wie kann das Problem des jQuery AJAX-Fehlers 403 gelöst werden? Feb 23, 2024 pm 04:27 PM

Wie kann das Problem des jQueryAJAX-Fehlers 403 gelöst werden? Bei der Entwicklung von Webanwendungen wird jQuery häufig zum Senden asynchroner Anfragen verwendet. Allerdings kann bei der Verwendung von jQueryAJAX manchmal der Fehlercode 403 auftreten, der darauf hinweist, dass der Zugriff vom Server verboten ist. Dies wird normalerweise durch serverseitige Sicherheitseinstellungen verursacht, es gibt jedoch Möglichkeiten, das Problem zu beheben. In diesem Artikel wird erläutert, wie Sie das Problem des jQueryAJAX-Fehlers 403 lösen können, und es werden spezifische Codebeispiele bereitgestellt. 1. machen

See all articles