Question

所以我基本上需要一个文本输入，用户可以在输入后输入任何内容，我希望该文本存储在页面上并显示在页面上并停留在页面上，我不希望它在刷新后消失。我尝试了所有方法并在Google上搜索了它，但似乎没有用，如果有人可以帮助我，我将不胜感激，这是我的代码：

HTML：

version: '3'
services:
  server:
    build:
      context: ./server
  client:
    build:
      context: ./client
    env:
      SERVER_URL: 'http://server/'

JavaScript：

<input id="NewPostField" type="text" value="Some text">
<button onclick="myFunction()">Add new post</button>
<div id="Posts"></div>

我了解function myFunction() { var NewPostField = document.getElementById("NewPostField"); var newPost = document.createElement("p"); newPost.innerHTML = NewPostField.value; var Posts = document.getElementById("Posts"); Posts.appendChild(newPost); }和localStorage，但是我需要帮助使其正常工作

Answer 1

我对您的js代码做了一个简单的更改，您可以尝试开始更多地了解localstorage。

function myFunction() {
  var NewPostField = document.getElementById("NewPostField");
  var newPost = document.createElement("p");

  localStorage.setItem('text', NewPostField.value);
  newPost.innerHTML = NewPostField.value;

  var Posts = document.getElementById("Posts");
  Posts.appendChild(newPost);
}

(function() {
  const previousText = localStorage.getItem('text');
  if (previousText) {
    var NewPostField = document.getElementById("NewPostField");
    NewPostField.value = previousText;

    myFunction();
  }
})();

如您所见，页面加载时，它将执行第二种方法，该方法将设置获取保存在本地存储中的数据并将其加载到页面中的输入中，并且还将创建<p>标签以像您一样在页面中显示该文本。

Answer 2

您应该使用PHP $_SESSION或JS localStorage或cookie。

有很多方法可以在客户端或服务器端存储数据。您必须查看教程。

如果您对其中一种方法有疑问，可以隔离问题并从那里进行调试，但是我们不会为您编写代码。

如果您遇到问题，请提供明确说明Minimal, Complete, and Verifiable example无效的原因。我建议阅读How to Ask a good question。另外，请确保take the tour

存储文本输入并将其显示在页面上

2 个答案: