Application de base des cookies JavaScript (méthode d'enregistrement du nom d'utilisateur)-js tutoriel-php.cn

Application de base des cookies JavaScript (méthode d'enregistrement du nom d'utilisateur)

亚连

Libérer： 2018-05-19 15:49:24

original

1444 Les gens l'ont consulté

Cet article présente principalement la méthode d'enregistrement des noms d'utilisateur dans l'application de base des cookies javascript, impliquant des applications simples de javascript basées sur des cookies pour le stockage de données. Les amis dans le besoin peuvent s'y référer

Cet article explique le. bases des cookies javascript avec exemples La méthode utilisée par l'application pour enregistrer les noms d'utilisateur. Partagez-le avec tout le monde pour votre référence, les détails sont les suivants :

Il y a un article sur les bases des cookies, qui encapsule cookie.js. Ci-dessous, nous utilisons un exemple pour appliquer ce js.

La méthode la plus courante consiste à mémoriser le nom d'utilisateur. Une fois que l'utilisateur s'est connecté une fois, le compte et le mot de passe de l'utilisateur sont enregistrés via des cookies, de sorte que la prochaine fois que la page est ouverte, l'utilisateur n'a pas besoin de le faire. saisissez à nouveau le compte et le mot de passe. Code ci-joint :

<!DOCTYPE HTML>
<html lang="en-US">
<head>
  <meta charset="UTF-8">
  <title>cookie的应用——记住用户名</title>
</head>
<body>
  <form action="#" id="myform">
    <label for="username">用户名：</label><input type="text" name="username" id="username" />
    <label for="userpass">密码：</label><input type="password" name="userpass" id="userpass" />
    <input type="submit" value="登录" />
    <a href="javascript:;">清除记录</a>
  </form>
</body>
</html>
<script type="text/javascript" src="cookie.js"></script>
<script type="text/javascript">
window.onload = function(){
  var oForm = document.getElementById(&#39;myform&#39;);
  var oTxt1 = document.getElementById(&#39;username&#39;);
  var oTxt2 = document.getElementById(&#39;userpass&#39;);
  var oClear = document.getElementsByTagName(&#39;a&#39;)[0];
  oTxt1.value = getCookie(&#39;username&#39;);
  oTxt2.value = getCookie(&#39;userpass&#39;);
  oForm.onsubmit = function(){
    setCookie(&#39;username&#39;,oTxt1.value,30);
    setCookie(&#39;userpass&#39;,oTxt2.value,30);
  }
  oClear.onclick = function(){
    removeCookie(&#39;username&#39;);
    removeCookie(&#39;userpass&#39;);
    oTxt1.value = &#39;&#39;;
    oTxt2.value = &#39;&#39;;
  }
}
</script>

Copier après la connexion

PS : Publiez le cookie.js dans l'article précédent ici pour que tout le monde puisse le voir :

function setCookie(name,value,hours){
 var d = new Date();
 d.setTime(d.getTime() + hours * 3600 * 1000);
 document.cookie = name + &#39;=&#39; + value + &#39;; expires=&#39; + d.toGMTString();
}
function getCookie(name){
 var arr = document.cookie.split(&#39;; &#39;);
 for(var i = 0; i < arr.length; i++){
  var temp = arr[i].split(&#39;=&#39;);
  if(temp[0] == name){
   return temp[1];
  }
 }
 return &#39;&#39;;
}
function removeCookie(name){
 var d = new Date();
 d.setTime(d.getTime() - 10000);
 document.cookie = name + &#39;=1; expires=&#39; + d.toGMTString();
}

Copier après la connexion

Ce qui précède est ce que j'ai compilé pour vous. J'espère qu'il vous sera utile à l'avenir.

Articles associés :

Explication détaillée du cookie JavaScript et exemple d'application simple (tutoriel image et texte)

Comprendre et compréhension du cookie JavaScript Utilisation du

cookie javascriptUtilisation (concept, paramétrage, lecture et suppression)

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!