如何永久存储用户数据

我目前正在做一个学校项目，我负责从头开始创建论坛。我打算创建一个“添加部分”按钮，单击它时会创建一个新的问题框。不过，我不确定我该如何去做。如何永久存储用户数据

我到目前为止能够实现的目标是利用用户传递给我的数据，但是我无法确保一旦用户刷新后它仍然保留在我的代码中。这是本地存储的限制吗？如果是的话，我可以使用的任何替代方案？我的代码我的代码

<!doctype html> 
<html> 
    <head> 
    <link rel="stylesheet" type="text/css" href="Testing.css"> 
    <script> 
    function addNew(){ 
    var datatwo = localStorage.datatwo; 
    var newData = document.createTextNode(datatwo); 
    var hello = document.createElement("th"); 
    hello.appendChild(newData); 
    document.getElementById("Questions").appendChild(hello); 
} 
    </script> 
    </head> 

    <body> 
    <div id="Addnew"> 
     <button onclick="addNew()" id ="AddNewButton">Add new </button> 
    </div> 
    <h1>This is Page 1 </h1> 
    <table> 
     <tr id="Questions"> 
     <th>What is my Name</th> 
     <th>What is his name</th> 

     </tr> 

     <tr> 
     <td>Justin</td> 
     <td>James</td> 
     </tr> 
    </table> 
     <nav> 
      <div id="footerPages"> 

        <ul> 
         <li><p>Page 1 of 3</p></li> 
         <li><a href=""> < Prev </a></li> 
         <li><a href="#"> 1 </a></li> 
         <li><a href="Testing2.html"> 2 </a></li> 

         <li><a href="#"> 3 </a></li> 
         <li><a href="#"> 4 </a></li> 
         <li><a href="#"> 5 </a></li> 
         <li><a href="#"> 6 </a></li> 
         <li><a href="#"> 7 </a></li> 
          <li><a href="Testing2.html"> Next ></a></li> 
       </ul> 
      </div> 
      </nav> 




    </body> 

</html>

第2页

<!doctype html> 
<html> 
    <head> 
    <link rel="stylesheet" type="text/css" href="Testing.css"> 
    <script> 
    function addNew(){ 
    var data = prompt("What is your question?"); 
    localStorage.datatwo = data; 

    } 
    </script> 
    </head> 

    <body> 
    <div id="Addnew"> 
     <button onclick="addNew()" id ="AddNewButton">Add new </button> 
    </div> 
    <h1>HI THIS IS PAGE 2</h1> 
    <table> 
     <tr id="Questions"> 
     <th>What is my Name</th> 
     <th>What is his name</th> 

     </tr> 

     <tr> 
     <td>Justin</td> 
     <td>James</td> 
     </tr> 
    </table> 
     <nav> 
      <div id="footerPages"> 

        <ul> 
         <li><p>Page 1 of 3</p></li> 
         <li><a href="Testing.html"> < Prev </a></li> 
         <li><a href="Testing.html"> 1 </a></li> 
         <li><a href="#"> 2 </a></li> 
         <li><a href="#"> 3 </a></li> 
          <li><a href="#"> Next ></a></li> 
       </ul> 
      </div> 
      </nav> 




    </body> 

</html>

来源

2016-07-17 Justin Soh

看起来你的两页代码是一样的 –

你也可以采用（选择）任何现成的使用论坛，如cms为您的项目。（PHP BB） –

这是

localStorage.setItem(key, value); 
localStorage.getItem(key, value);

你的代码是不持久的，因为你只是设置一些属性的目的。

来源

2016-07-17 07:29:09

正如你所说你正在做一个学校项目，所以我不是责怪你在你的项目中使用普通的JavaScript（没有JavaScript框架）。但是你可以使用jQuery来简化它。

LocalStorage用于在本地存储数据（永久为您）。 SessionStorage用于存储每个会话/选项卡的数据。

我想你要存储的数据更新到第1页。要做到这一点改变你的脚本标记，

<script> 
    function addNew(){ 
    var questionHead = document.createTextNode("Your Question"); 

    var queHeadElement = document.createElement("th"); 
    queHeadElement.appendChild(questionHead); 
    document.getElementById("Questions").appendChild(queHeadElement); 

    var datatwo = localStorage.datatwo; 
    var newQuestionText = document.createTextNode(datatwo); 
    var newQuestionTextElement = document.createElement("td"); 
    newQuestionTextElement.appendChild(newQuestionText); 
    document.getElementById("myNewQuestion").appendChild(newQuestionTextElement); 
} 
    </script>

，改变你的表与此

<table> 
    <tr id="Questions"> 
    <th>What is my Name</th> 
    <th>What is his name</th> 

    </tr> 

    <tr id="myNewQuestion"> 
    <td>Justin</td> 
    <td>James</td> 
    </tr> 
</table>

使用此代码，最新数据从localStorage将按钮单击显示在表中。

上面的代码将正常工作。但我想在这里再提一点。

<li><a href=""> < Prev </a></li>

如果你想使用小于或大于像<上一个浏览器符号将当作如果上一个是一个HTML元素。并且浏览器将尝试查找其结束标记为<上一个/ >或<上一个> < /上一个>。虽然上面的代码在这里工作，但不应该用这种方式写。你应该总是使用<为<符号和>为>

<li><a href=""> &gt; Prev </a></li>

我希望这个回答将帮助你在你的项目。祝您的项目好运。

来源

2016-07-17 07:40:39

如何永久存储用户数据

回答

相关问题