记住用户名
-
把数据存起来,用到本地存储
-
关闭页面,也可以显示用户名,所以用到localStorage
-
打开页面,先判断是否有这个用户名,如果有,就在表单里面显示用户名,并且勾选复选框
-
当复选框发生改变的时候change事件
-
如果勾选,就存储,否则就移除
<script> var username = document.querySelector('#username'); var remember = document.querySelector('#remember'); var uName = localStorage.getItem('uName'); if (uName) { username.value = uName; remember.checked = true; } username.addEventListener('blur', function () { if (uName != username.value && remember.checked == true) { localStorage.setItem('uName', username.value); } }) remember.addEventListener('change', function () { if (this.checked) { localStorage.setItem('uName', username.value) } else { localStorage.removeItem('uName'); } }) </script>
<input type="text" id="username"> <input type="checkbox" name="" id="remember"> 记住用户名