LocalStorage记牢客户和登陆密码作用

日期:2021-02-23 类型:科技新闻 

关键词:免费自助建站,手机建站平台,wap建站,免费自助建站平台,H5网站,H5模板建站

 伴随着HTML5标准的普及,大家已不用cookie来完成记牢登陆密码,一般会用的LocalStorage及当地缓存文件。

    针对Cookie来讲它仅有1个document.cookie这1个API可使用,无论是载入Cookie還是储存Cookie你都只能应用它

    但是LocalStorage,你储存的情况下有localStorage.setItem(),你载入的情况下有localStorage.getItem(),你要想删掉的情况下有localStorage.removeItem().另外在储存时,它们事以键值对的方式储存的.因此更容易于应用.而且localStorge的存储室内空间大,有5M,而且是永久性存储,除非你积极删掉。

下面附1个简易的小事例:

<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
   <form>
        <h3>Log in</h3>
        <input type="text" name="user" placeholder="user" id="user">
        <input type="password" name="pass" placeholder="password" id="pass">
        <input type="checkbox" id="remember" checked><br/><br/>
        <input type="button" value="登陆" id="sub" onclick="loginBtn_click()">
    </form>
<script type="text/javascript">
    $(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();
        }
</script>

总结

以上所述是网编给大伙儿详细介绍的LocalStorage记牢客户和登陆密码作用,期待对大伙儿有一定的协助,假如大伙儿有任何疑惑请给我留言,网编会立即回应大伙儿的。在此也十分谢谢大伙儿对脚本制作之家网站的适用!

上一篇:详解HTML5 window.postMessage与跨域 返回下一篇:没有了