zoukankan      html  css  js  c++  java
  • Web Storage —— 登录时记住密码

    在做登录界面时,有时会要前端记住密码,这里可以用Web Storage内容来实现。实现的效果如下:

        

     此处省略HTML代码,主要写js代码,如下

     1 //页面加载时的代码
     2 var strName = localStorage.getItem("keyName");//在本地取得用户名
     3 var strPass = localStorage.getItem("keyPass");//在本地取得密码
     4 if (strName){ //如果用户名存在
     5     $("txtName").val(strName);
     6 }
     7 if (strPass){  //如果密码存在
     8     $("txtPass").val(strPass);
     9 }
    10 //单击登录后的代码
    11 var strName = $("txtName").val();
    12 var strPass = $("txtPass").val();
    13 localStorage.setItem("keyName",strName);//本地保存用户名
    14 if($("chkSave").is(':checked')){ //记住密码
    15     localStorage.setItem("keyPass",strPass); //在本地保存密码
    16 }
    17 else{
    18     localStorage.remove("keyPass");  //移除密码
    19 }
    20     

    普及一下Web Storage的基础,有两种在客户端存储数据的方法:localStorage 和 sessionStorage。它们的区别如下

    (1)localStorage 是一种没有时间限制的数据存储方式,用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。

    (2)sessionStorage 用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问,并且当会话结束后数据也随之销毁。因此sessionStorage 不是一种持久化的本地存储,仅仅是会话级别的存储。

    (3)localStorage 和 sessionStorage 对象拥有相同的属性和方法。

  • 相关阅读:
    Educational Codeforces Round 97 (Rated for Div. 2)
    2020 计蒜之道 线上决赛
    kuangbin 莫队专题
    Codeforces Round #677 (Div. 3)
    Codeforces Round #674 (Div. 3)
    Elasticsearch Alias:别名
    Elasticsearch 集群重要配置的修改
    Elasticsearch文档版本冲突原理与解决
    redis操作详情
    对密码必须包含字母,数字,特殊字符正则表达式理解
  • 原文地址:https://www.cnblogs.com/daheiylx/p/9334893.html
Copyright © 2011-2022 走看看