效果如下
勾选之后无论怎么刷新都不会清除框里面的数据，除非手动删除或者取消勾选
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="user-scalable=none"> <title>Title</title> </head> <body> 账号<input type="text" id="username"> <br> 密码<input type="password" id="pass"><input type="checkbox" id="remember_password" class="cesqwe">记住密码 <button onclick="asd()">123</button> <script> var ipt = document.querySelector('#username') var rem_T = document.querySelector('.cesqwe') var rem_P = document.querySelector('.cesqwe') var password = document.querySelector('#pass') if (localStorage.getItem('ipt')) { ipt.value = (localStorage.getItem('ipt')) rem_T.checked = true } if (localStorage.getItem('password')) { password.value = (localStorage.getItem('password')) rem_P.checked = true } rem_T.addEventListener('change', function() { if (this.checked) { localStorage.setItem('ipt', ipt.value) } else { localStorage.removeItem('ipt') } }) rem_P.addEventListener('change', function() { if (this.checked) { localStorage.setItem('password', password.value) } else { localStorage.removeItem('password') } }) </script> </body> </html>
