zoukankan html css js c++ java

js 使用localStorage本地存储用户名、密码

效果图如下：

代码如下：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <style>
        #check{
            width: 15px;
            height: 15px;
        }
    </style>
    <body>
        <span>用户名：</span>
        <input id="uname" />
        <span>密码</span>
        <input type="password" id="psw" />
        <br>
        <br>
        <input type="checkbox" id="check" />
        <span>存储用户名、密码到本地</span>
    </body>
    <script>
        var uname = document.querySelector("#uname");
        var psw = document.querySelector("#psw");
        var check = document.querySelector("#check");
        
        uname.addEventListener("change",()=>{
            if(!localStorage.getItem(uname.value)){
                check.checked = false;
            }
        })
        check.addEventListener("change",()=>{
            if(check.checked){
                //选中，记住账号名和密码
                localStorage.setItem(uname.value, psw.value);
                console.log(localStorage.getItem(uname.value));
            }
        })
    </script>
</html>

查看全文

相关阅读:
datalist标签
 meter标签
 audio标签
 video标签
 time标签
 figure标签
 正则收集
 js文字无缝滚动
 页面滚动到指定位置
 Css公共文件结构

原文地址：https://www.cnblogs.com/sunshine233/p/15633546.html