如何永久存儲用戶數據

我目前正在做一個學校項目，我負責從頭開始創建論壇。我打算創建一個「添加部分」按鈕，單擊它時會創建一個新的問題框。不過，我不確定我該如何去做。如何永久存儲用戶數據

我到目前爲止能夠實現的目標是利用用戶傳遞給我的數據，但是我無法確保一旦用戶刷新後它仍然保留在我的代碼中。這是本地存儲的限制嗎？如果是的話，我可以使用的任何替代方案？我的代碼我的代碼

<!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

如何永久存儲用戶數據

回答

相關問題