如何根据用户输入（HTML）永久更改网站内容？

Question

所以我正在制作一个网站（在 HTML 中），用户可以在其中永久地将文本添加到网站的内容中。因此，如果有人在那之后访问该网站，他会看到修改后的内容。修改应该是永久性的，并且在重新加载后不应该消失。 为此，我使用了以下代码：

        <form id="myform" method="POST" action="">
            <input type="text" name="textbox" value="">
            <input type="button" name="button1" value="SUBMIT" onclick="func()">
        </form>
        <br>
        <p id="Test"></p>
        <script>
            function func()
            {
                var x=document.getElementById("myform");
                var text=x.elements[0].value;
                document.getElementById("Test").innerHTML+=text;
            }
        </script>

但更改仅在客户端进行，而不是在网站上进行。那么如何根据用户输入更改网站的源代码，以便永久更改。在这种情况下，对<p id="Test"></p> 所做的更改如何在页面重新加载后恢复到默认值时保持永久不变。 非常感谢！

Answer 1

这个过程包含两个要执行的步骤。

1. 您已执行，从客户端收集用户输入。
2. 您必须将此数据发送到您的服务器和服务器 然后将这些数据保存在您的数据库中，然后您的 html 页面得到 来自服务器和用户的更新数据将看到修改后的内容。

要向服务器发送数据，您必须使用 ajax post 请求向服务器发送数据 像这样

request = $.ajax({
    url: "Your server url",
    type: "post",
    data: data
});

// Callback handler that will be called on success
request.done(function (response, textStatus, jqXHR){
    // Log a message to the console
    console.log("Hooray, it worked!");
});

然后服务器将收到它并将数据保存到数据库中。