如何增加本地存储长度

kgqe7b3p  于 2021-09-13  发布在  Java
关注(0)|答案(0)|浏览(204)

我正在使用纯javascript制作一个笔记制作网站
这是一个html布局

<!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>Note taking website</title>
    <style>
        #container {
            text-align: center;
        }

        #container1 {
            text-align: center;
        }

        #flex {
            display: flex;
            flex-direction: row;
            margin: 20px 377px;
        }

        #show-notes {
            width: 278px;
            background-color: #70e0d3;
            height: 204px;
            border: 2px solid purple;
            margin: 3px 8px;

        }

        h3 {
            margin-bottom: 0px;
            margin-top: 6px;
        }
    </style>
</head>

<body>
    <section id="container" class="contain">
        <div id="top">
            <h1 class="head">Note Taking Website</h1>
        </div>
        <div class="second">
            <textarea name="area" id="text" cols="110" rows="10" placeholder="Enter here something"></textarea>
        </div>
        <div class="second" id="class-btn">
            <button id="btn" type="submit">Submit</button>
        </div>
    </section>
    <section id="container1">
        <h1 id="notes">Your Notes</h1>
        <div id="flex">
            <!-- <div id="show-notes">
                <h3>Notes</h3>
                <p id="para">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quibusdam natus unde reiciendis
                    maiores sint
                    suscipit explicabo quisquam et, odit consequatur fugiat, repellat fugit nihil placeat aspernatur
                    accusamus praesentium facere tempore modi eos? Eum, nisi laudantium dolorum hic mollitia corrupti
                    sequi incidunt cum culpa enim.</p>
            </div> -->

        </div>
    </section>
    <script src="javatut/app.js"></script>
    <!-- <script src="team.js"></script> -->
</body>

</html>

在构建布局之后,我想在javascript中将字符串保存在localstorage中。当用户单击“提交”按钮时,我必须显示notes,无论在notes部分下的文本区域输入中是什么,但当我在控制台中检查长度时,在localstorage中添加多个字符串后,它只显示长度1。请帮助我增加localstorage的长度,您可以运行下面的代码

let button  = document.getElementById("btn")
button.addEventListener("click",function(e){
     let txtara =document.getElementById("text")
     let notes = localStorage.getItem("note");
  let textobj;
  if (notes==null)
 {
       textobj = [];
     } 
     else
     {
          textobj =JSON.parse(notes);
     }
    textobj.push(txtara.value);
 localStorage.setItem("note",JSON.stringify(textobj))
      // console.log(typeof notes)
})

暂无答案!

目前还没有任何答案,快来回答吧!

相关问题