LocalStorage記住用戶和密碼功能

隨著HTML5規範的普及，我們不再用cookie來實現記住密碼，通常會用的LocalStorage及本地緩存。

對於Cookie來說它只有一個document.cookie這一個API可以使用,不管是讀取Cookie還是存儲Cookie你都只能使用它

然而LocalStorage,你存儲的時候有localStorage.setItem() ,你讀取的時候有localStorage.getItem() ,你想要刪除的時候有localStorage.removeItem() .此外在存儲時,它們事以鍵值對的形式存儲的.所以更易於使用.並且localStorge的儲存空間大，有5M,並且是永久儲存，除非你主動刪除。

下面附一個簡單的小例子：

 <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記住用戶和密碼功能，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對VeVb武林網網站的支持！