如何允许用户编辑网页内容并将其保存给所有查看者？ [关闭]答案

【问题标题】：How to allow users to edit content of webpage and save it for all viewers? [closed]如何允许用户编辑网页内容并将其保存给所有查看者？ [关闭]
【发布时间】：2022-01-22 21:05:45
【问题描述】：

我正在尝试创建一个以简单文本“Hello”开头的网站。然后，任何访问该网站的人都可以将内容更改为他们喜欢的任何内容，不仅为自己保存，还为网站本身保存。然后另一个观众可以进来并改变它，等等。我还想保留一个包含所有已编辑内容的数据库，但仅限于我自己。

所以我的问题是，哪些工具/语言会对此有所帮助？ 或者任何人都可以指出任何教程？我是一个初学者，我真的不知道从哪里开始。这似乎真的很有帮助，但它似乎只为自己做出改变。：http://www.developerdrive.com/2012/06/allowing-users-to-edit-text-content-with-html5/

对不起，如果这是一个非常简单的问题，我过于复杂了。感谢您的帮助！

【问题讨论】：

我认为这个问题对于这个网站来说太宽泛了。当然，有很多方法可以让用户在客户端编辑文本，还有很多方法可以在数据更新到服务器时发送数据，以及从服务器读取更新的数据。你可以用 php、ruby 来做到这一点——几乎任何东西。我可能会选择 node.js——尤其是像 Meteor 这样的综合实时页面更新框架
我认为 OP 实际上只是在寻找关于从哪里开始的指针。我相信我们至少都可以做到这一点。
当 OP 正在寻找指针时，它会进行问卷调查以弄清楚 OP 知道什么以及他们的思维如何与语言一起工作； PHP 不是 Ruby，并且使用这两者的网站设计方式不同。有大量的 HTML/JavaScript/CSS 知识以及 PHP 或 Ruby，以及为此所需的数据库设计。如果没有这些信息，我们提供的任何东西都只是意见，这让 Stack Overflow 的问题离题了。

标签： php ruby html edit

【解决方案1】：

听起来更像是一个维基百科网站。如果这是您想要的，请使用开源工具/软件Mediawiki。你可以在这里下载它Mediawiki

首先将它安装在您的系统中，然后使用它来创建、编辑页面等

【讨论】：

【解决方案2】：

您的问题有很多方面。首先，您可能需要一个注册/登录系统。为此，您需要前端 (javascript/jQuery) 和后端 (PHP) 编程。

如果您有登录系统，您应该了解 PHP 会话。

您需要读/写数据库。这将是后端（PHP）。许多教程目前仅涵盖较旧的 mysql_ 命令；您必须学习 mysqli_ 或 PDO 格式（因为旧样式仍然有效但已弃用）。

你应该学习 jQuery 和 javascript。 jQuery 会很有帮助，不要听那些说你必须先学习 javascript 的人——我没有，我现在正在填写我在设计了许多网站后对 javascript 的遗漏。

有很多地方可以找到教程，但我可以推荐这些：

PHPAcademy.org - 曾经是免费的，但现在只是低价
Registration and Login tutorial
PHP and MySQL with PDO and mysqli_
TheNewBoston.com -- 试试这个：
Project Lisa - Unfinished tutorial but very good
Intro to PHP
Intro to jQuery

您是正确的，您发布的示例仅保存当前用户的编辑（以及同一用户未来的访问）。更改保存在用户的本地计算机上，而不是服务器上。在服务器上存储编辑的最简单方法是将它们写入数据库，例如 MySQL。

下面是一个例子，说明为什么你可能更喜欢学习 jQuery 而不是普通的 javascript：

javascript方式：

function saveEdits() {
    //get the editable element
    var editElem = document.getElementById("edit");

    //get the edited element content
    var userVersion = editElem.innerHTML;

    //save the content to local storage
    localStorage.userEdits = userVersion;

    //write a confirmation to the user
    document.getElementById("update").innerHTML="Edits saved!";

}

jQuery方式：

function saveEdits() {
    //get the edited element content
    var userVersion = $("#edit").var();

    //save the content to local storage
    localStorage.userEdits = userVersion;

    //write a confirmation to the user
    $("#update").val("Edits saved!");

}

使用 jQuery 方式的输入更少——尤其是在整个项目中。此外，jQuery 会为您处理所有跨浏览器问题。使用 javascript，您必须自己为每个浏览器编写代码。对于大多数开发人员来说，jQuery 更快更容易。

【讨论】：