如何在网页上做所见即所得的部分？ [英] How to make a WYSIWYG section on a web page?

问题描述

我想知道网页上所见即所得页面的基本原理。我开始编码它，并使用一个文本区域，但很快我意识到，我无法添加或显示图像或文本区域中的任何HTML。所以我做了它使用DIV的，但我不明白我怎么能使其可编辑。

I want to know the basic principle used for WYSIWYG pages on the web. I started coding it and made it using a text area, but very soon I realized that I cannot add or show images or any HTML in the text area. So I made it using DIV, but I did not understand how I could make it editable.

所以，要点，请我想知道如何（原则）做一个网页上的可编辑DIV部分，类似于谷歌文档或FCKEditor的或TinyMCE的东西。

我将是任何指针非常感激，信息。

I would be very grateful for any pointers and info.

谢谢！

推荐答案

还有的<$ C $可以添加到任何元件的页的C> CONTENTEDITABLE 标志以使其可编辑，例如

There's the contentEditable flag that can be added to any element on a page to make it editable, eg.

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

应该在时下所有主流浏览器，以及诸如此类的快捷方式键（CMD / CTRL-B等）将正常工作。

Should work in all major browsers nowadays, and things like shortcuts keys (cmd/ctrl-b, etc) will Just Work.

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

Form submission can then be done by pulling innerHTML out of the editable region.

这篇关于如何在网页上做所见即所得的部分？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！