Maison > Article > interface Web > Partage de code simple pour l'opération de connexion JavaScript et de mémorisation du mot de passe

Partage de code simple pour l'opération de connexion JavaScript et de mémorisation du mot de passe

黄舟original: 2017-03-23 14:32:541631parcourir

Cet article partagera avec vous une simple implémentation du code js Connexion utilisateur N'oubliez pas l'opération du mot de passe, le code est simple et facile à comprendre, très bon, et a une valeur de référence. Les amis qui en ont besoin peuvent s'y référer

Plus de bêtises, je posterai le code directement pour. tout le monde. Le code spécifique est le suivant :

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>记住密码</title>
</head>
<body>
<form id="loginForm">
  <input id="user" type="text" placeholder="用户名"><br>
  <input id="pswd" type="password" placeholder="密码"><br>
  <label><input id="remember" type="checkbox">记住密码</label><br>
  <input type=&#39;submit&#39; value="登录">
</form>
<script>
  window.onload = function(){
    var oForm = document.getElementById(&#39;loginForm&#39;);
    var oUser = document.getElementById(&#39;user&#39;);
    var oPswd = document.getElementById(&#39;pswd&#39;);
    var oRemember = document.getElementById(&#39;remember&#39;);
    //页面初始化时，如果帐号密码cookie存在则填充
    if(getCookie(&#39;user&#39;) && getCookie(&#39;pswd&#39;)){
      oUser.value = getCookie(&#39;user&#39;);
      oPswd.value = getCookie(&#39;pswd&#39;);
      oRemember.checked = true;
    }
    //复选框勾选状态发生改变时，如果未勾选则清除cookie
    oRemember.onchange = function(){
      if(!this.checked){
        delCookie(&#39;user&#39;);
        delCookie(&#39;pswd&#39;);
      }
    };
    //表单提交事件触发时，如果复选框是勾选状态则保存cookie
    oForm.onsubmit = function(){
      if(remember.checked){ 
        setCookie(&#39;user&#39;,oUser.value,7); //保存帐号到cookie，有效期7天
        setCookie(&#39;pswd&#39;,oPswd.value,7); //保存密码到cookie，有效期7天
      }
    };
  };
  //设置cookie
  function setCookie(name,value,day){
    var date = new Date();
    date.setDate(date.getDate() + day);
    document.cookie = name + &#39;=&#39; + value + &#39;;expires=&#39;+ date;
  };
  //获取cookie
  function getCookie(name){
    var reg = RegExp(name+&#39;=([^;]+)&#39;);
    var arr = document.cookie.match(reg);
    if(arr){
      return arr[1];
    }else{
      return &#39;&#39;;
    }
  };
  //删除cookie
  function delCookie(name){
    setCookie(name,null,-1);
  };
</script>
</body>
</html>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Introduction détaillée à la méthode d'insertion et d'ajout de nœuds d'étiquette de texte au niveau du curseur en JavaScriptArticle suivant：Introduction détaillée à la méthode d'insertion et d'ajout de nœuds d'étiquette de texte au niveau du curseur en JavaScript

Articles Liés

Voir plus