为何输入的数据不能存储或追加在本地存储中

小黄练编程 · 发表于 2022-5-25 21:21:40

您需要登录才可以下载或查看，没有账号？立即注册

x

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
label{
width:50px;
display:inline-block;
text-align:left;
}
form{
width:260px;
height:100px;
background-color:aqua;
text-align:center;
}
</style>
</head>
<body>
<h1>试试看，能否登入自己qq</h1>
<form action="#" method="get">
<label>qq:</label><input type="text" name="usname" placeholder="请输入qq号" class="iptone" >
<label>密码:</label><input type="password" placeholder="请输入密码" name="password" class="ipttwo" >
<input type="submit" value="登录" class="submit">
</form>
<ul class="ulul">
</ul>
</body>
<script>
const iptone=document.querySelector('.iptone');
const ipttwo=document.querySelector('.ipttwo');
const submit=document.querySelector('.submit');
const ulul=document.querySelector('ulul');
submit.addEventListener('click',function(){
var datao= iptone.value;
var datat=ipttwo.value;
var dataall=datao+'+'+datat;
var local=getdata();
local.push(dataall);
savadate(local);
})
function getdata(){
var data=localStorage.getItem('usename');
if(data!==null){
return JSON.parse(data);
}
else{
return [];
}
}
function savadate(data){
loaclStorage.setItem('usename',JSON.stringify(data));
}
</script>
</html>

复制代码

2012277033 · 发表于 2022-5-29 11:57:39

你这个登录按钮是个submit类型的，点击时是向#发起get请求，这时会发生一个页面跳转。。。其次，你的savadate方法的localStorage写成了loaclStorage。所以会报错，你应该是因为页面跳转，所以没看到报错信息。。。。

账号		自动登录	找回密码
密码			立即注册