javascript - 如何在网页上制作所见即所得的部分？

Question

我想知道 Web 上所见即所得页面的基本原理。我开始编写代码并使用文本区域制作它，但很快我意识到我无法在文本区域中添加或显示图像或任何 HTML。所以我使用 DIV 制作它，但我不明白如何让它可编辑。

因此，要点是，我想知道如何(原则上)在网页上制作可编辑的 DIV 部分，类似于 Google 文档或 FCKEditor 或 TinyMCE。

如果有任何指点和信息，我将不胜感激。

谢谢!

Answer 1

可以将 contentEditable 标志添加到页面上的任何元素以使其可编辑，例如。

<div contentEditable>I am editable!!!!</div>

现在应该可以在所有主流浏览器中使用，快捷键(cmd/ctrl-b 等)之类的东西也可以使用。

然后可以通过将 innerHTML 拉出可编辑区域来完成表单提交。