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

小黄练编程 · 发表于 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。所以会报错，你应该是因为页面跳转，所以没看到报错信息。。。。

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