如何讓網頁應用程序保留信息？

Question

好吧...所以用戶在journal字段中輸入信息並點擊提交，然後調用函數調用他們提交的信息，我稱其爲changeTextComment（）。該函數調用另一個函數等等，因爲信息被格式化並放置在提示中，如在Facebook評論中。

我需要保存這些信息，以便稍後在本地存儲中調用，這樣每次重新啓動時都不會刷新應用程序。所以......

<script> 
function appCache() { 
// Check browser support 
// this is experimental for local storage... 
more here: http://www.w3schools.com/html/html5_webstorage.asp 

if (typeof(Storage) != "undefined") { 
    localStorage.setItem(para); 
      // Retrieve 
      document.getElementById("journal").innerHTML = localStorage.getItem(para); 
     } else { 
      document.getElementById("result").innerHTML = "Sorry, your browser does not support Web Storage..."; 
     }; 
     </script> 

所以看應用程序緩存功能，它似乎像它可能工作只是我需要找出的關鍵變量是什麼，將被存儲，然後檢索。

我認爲這是變量userInput，因爲任何時候用戶點擊'添加到日誌'按鈕，這個變量用於存儲用戶輸入，然後放入changeTextComment（）函數中。

我在想，如果這是處理這件事的最簡單的方法......我還不懂數據庫，但想知道是否會更容易學習。在這種情況下，我會將函數Appcache（）添加到函數changeText（）中，以便它緩存變量，然後如何設置它，然後將變量的緩存信息的值提供給changeText（）應用程序啓動後？

每次提交給期刊都會有獨特的價值。

繼承人的ChangeTextComment（）函數......還是整理出瞭如何使用班css來簡化這些功能：

function changeTextComment(){ 
// to be modified from the above to change the location of the dump 
var userInput = document.getElementById('userInput').value; 
// get the input from the user 
var panel = document.createElement("div"); // create a parent divider for everything 




// assignment of attributes 
panel.setAttribute("class","panel panel-default panel-body"); 
panel.setAttribute("id","panelBody"); 
var para = document.createElement("P"); 
var t = document.createTextNode(userInput); 
para.appendChild(t); 

// add comment area 
var c = document.createElement("INPUT"); 
c.setAttribute("type", "text"); 
c.setAttribute("id", "comment"); 
c.setAttribute("placeholder", "comment here"); 
c.setAttribute("class", "form-control input-lg"); 

// add comment button attempt -- success <> now try to put it in the textarea 
var d = document.createElement("INPUT"); 
d.setAttribute("type","button"); 
d.setAttribute("class","btn btn-info active pull-right"); 
d.setAttribute("onclick","commentThis()"); 
d.setAttribute("value","Add Comment"); 
panel.appendChild(para); // this is where a comments piece would go 


// place the item 
var destination = document.getElementById("journal") 
//destination.insertBefore(Commentaryarea, destination.firstChild); 
//destination.insertBefore(panel, destination.firstChild); 
destination.insertBefore(panel, destination.firstChild); 
panel.appendChild(c); 
panel.appendChild(d); 

document.getElementById("userInput").value = ""; 
document.getElementById("userInput").focus();} 
</script> 

<script> 
function setText(a){ 
    document.getElementById("userInput").value = a 
    document.getElementById("userInput").focus(); 
} 
</script> 

Answer 1

當你說「本地存儲」，你的意思是存儲在瀏覽器的訪問者，即只有他們自己能夠看到它並找回它？或者您是否希望其他用戶能夠查看數據，和/或評論者是否能夠在以後從其他位置登錄時看到它？

如果是後者，那麼您需要將它存儲在服務器端，並且您將需要一個數據庫。如果您只需要存儲日記帳分錄，那麼mongoDB很容易通過javascript進行設置，但是如果您有很多關係（日記帳分錄與用戶相關聯，則對條目的評論與用戶和分錄相關聯等），那麼也許SQL數據庫會更適合你。