Heim > Web-Frontend > js-Tutorial > So verwenden Sie JS-Code, um sich Konto und Passwort zu merken

So verwenden Sie JS-Code, um sich Konto und Passwort zu merken

php中世界最好的语言
Freigeben: 2018-03-06 16:06:01
Original
4157 Leute haben es durchsucht

Dieses Mal zeige ich Ihnen, wie Sie sich Konto und Passwort mit JS-Code merken. Was sind die Vorsichtsmaßnahmen für das Merken von Konto und Passwort mit JS-Code?

Viele Login-Funktionen verfügen über eine „Passwort merken“-Funktion, die eigentlich nichts anderes ist als das Auslesen des Cookies.

Referenz Cookie hinzufügen

setCookie (Name, Wert, Ablauftage)

Cookie abrufen

getCookie (Name)

Cookie löschen

delCookie (Name)

Codebeschreibung

Formularformular

<!-- 登陆表单 --><form method="post" autocomplete="off" onsubmit="return check()">
  <!-- 用户名输入 -->
  <input type="text"  name="username" id="username" required="required" >
  <!-- 密码输入,禁用自动填充 -->
  <input type="password" autocomplete="new-password" name="password" id="password" required="required">
  <!-- 是否记住密码复选框 -->
  <input type="checkbox" id="isRmbPwd" name="isRmbPwd" checked="checked">记住密码  <!-- 提交按钮 -->
  <input type="submit" value="提交"></form>
Nach dem Login kopieren

Senden-Prüffunktion

Wenn die Schaltfläche „Senden“ gedrückt wird Wenn darauf geklickt wird, wird diese Funktion aufgerufen

function check (){    //获取表单输入:用户名,密码,是否保存密码
    var username = document.getElementById("username").value.trim() ;    var password = document.getElementById("password").value.trim() ;    var isRmbPwd = document.getElementById("isRmbPwd").checked ;    
    //判断用户名,密码是否为空(全空格也算空)
    if ( username.length != 0 && password.length != 0 )
    {        //若复选框勾选,则添加Cookie,记录密码
        if ( isRmbPwd == true )
        {   
            setCookie ( "This is username", username, 7 ) ;
            setCookie ( username, password, 7 ) ;
        }        //否则清除Cookie
        else
        {
            delCookie ( "This is username" ) ;
            delCookie ( username ) ;
        }        return true ;
    }    //非法输入提示
    else
    {
        alert(&#39;请输入必填字段!!!&#39;)        return false ;
    }   
}
Nach dem Login kopieren

Dokumentinitialisierungsfunktion

Nachdem das Dokument geladen wurde, wird diese Funktion ausgeführt

//将function函数赋值给onload对象window.onload = function (){    //从Cookie获取到用户名
    var username = getCookie("This is username") ;    //如果用户名为空,则给表单元素赋空值
    if ( username == "" )
    {        document.getElementById("username").value="" ;        document.getElementById("password").value="" ;        document.getElementById("isRmbPwd").checked=false ;
    }    //获取对应的密码,并把用户名,密码赋值给表单
    else
    {        var password = getCookie(username) ;    
        document.getElementById("username").value = username ;        document.getElementById("password").value = password ;        document.getElementById("isRmbPwd").checked = true ;
    }
}
Nach dem Login kopieren

Geben Sie den Benutzernamen ein und Passwort, und das Kontrollkästchen wird nicht aktiviert. Senden Sie das Kontrollkästchen

und kehren Sie zur Formularseite zurück

Geben Sie den Benutzernamen und das Passwort ein und deaktivieren Sie das Kontrollkästchen

, um es abzusenden Gehen Sie im Formular zurück zu

und entfernen Sie es zu diesem Zeitpunkt. Aktivieren Sie das Kontrollkästchen und senden Sie es ab

Zu diesem Zeitpunkt speichert der Browser das Cookie nicht mehr

Ich glaube Ihnen Nachdem Sie diese Fälle gelesen haben, beherrschen Sie die Methode. Weitere spannende Informationen finden Sie auf der chinesischen PHP-Website. Andere verwandte Artikel!

Verwandte Lektüre:

So verwenden Sie die Base64-Codierung für HTML-Bilder anstelle von

So implementieren Sie scrollende Schriftarten und Bilder Verwendung von Marquee-Elementen Die Wirkung von

Das obige ist der detaillierte Inhalt vonSo verwenden Sie JS-Code, um sich Konto und Passwort zu merken. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage