LocalStorage如何实现记住用户和密码功能

这篇文章主要介绍了LocalStorage如何实现记住用户和密码功能,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。

创新互联长期为上1000+客户提供的网站建设服务,团队从业经验10年,关注不同地域、不同群体,并针对不同对象提供差异化的产品和服务;打造开放共赢平台,与合作伙伴共同营造健康的互联网生态环境。为陇县企业提供专业的成都做网站、网站制作,陇县网站改版等技术服务。拥有十载丰富建站经验和众多成功案例,为您定制开发。

 随着HTML5规范的普及,我们不再用cookie来实现记住密码,通常会用的LocalStorage及本地缓存。

    对于Cookie来说它只有一个document.cookie这一个API可以使用,不管是读取Cookie还是存储Cookie你都只能使用它

    然而LocalStorage,你存储的时候有localStorage.setItem(),你读取的时候有localStorage.getItem(),你想要删除的时候有localStorage.removeItem().此外在存储时,它们事以键值对的形式存储的.所以更易于使用.并且localStorge的储存空间大,有5M,并且是永久储存,除非你主动删除。

下面附一个简单的小例子:


   
        

Log in

                          

                  $(document).ready(function(){         var strName = localStorage.getItem('UserName');         var strPass = localStorage.getItem('UserPass');         if(strName){             $('#user').val(strName);         }if(strPass){             $('#pass').val(strPass);         }     });     function loginBtn_click(){         debugger             var strName = $('#user').val();             var strPass = $('#pass').val();             localStorage.setItem('UserName',strName);             if($('#remember').is(':checked')){                 localStorage.setItem('UserPass',strPass);             }else{                 localStorage.removeItem('UserPass');             }             window.location.reload();         }

感谢你能够认真阅读完这篇文章,希望小编分享的“LocalStorage如何实现记住用户和密码功能”这篇文章对大家有帮助,同时也希望大家多多支持创新互联,关注创新互联行业资讯频道,更多相关知识等着你来学习!


当前标题:LocalStorage如何实现记住用户和密码功能
文章链接:http://azwzsj.com/article/pipsop.html