问题标签 [contenteditable]

我目前正在为客户端构建一个 CMS，其中编辑页面看起来与渲染页面完全一样。

因此，我不想要基于 iframe 的 WYSIWYG，我正在寻找一种可以contenteditable消除 Firefox 和 Webkit 之间差异的包装器。

例如Enter，Firefox 中的按键会产生一个<br/>标签，而 Webkit 中的相同事件会导致它被包含在一个<div>标签中。

如果您对编辑器没有建议，那么您能帮我解决这个问题吗？我首先修复它的方法是检查onkeyup事件，然后使用execCommand“撤消”，然后使用insertHtml <br/>。

这很好用，但问题是如果用户在一个列表中，并且他们按 Enter 键，他们希望创建下一个列表元素，但最终会换行。当输入键被触发时，如何检测插入符号的位置，以便我可以跳过<br/>插入行为？

理想情况下，我什至不希望<br/>将文本块封装在<p>标签中以用于 SEO 目的，但我也无法解决这个问题。

任何帮助将不胜感激 ！

我对这段代码有疑问：

它在 Chrome 4/5/6 中运行良好，但在 FF (3.6.) 或 Opera (10.60) 中不起作用。

在 FF 中它会抛出这个异常：

错误：未捕获的异常：[异常...“指定了无效或非法字符串”代码：“12”nsresult：“0x8053000c（NS_ERROR_DOM_SYNTAX_ERR）”位置：“ http://www.www.com/js/script.js线：51"]

有谁知道为什么会发生这种情况以及如何解决它？

现在我正在使用这个修复，但它不是干净的解决方案，因为它留下了 contentEditable 属性，我必须在服务器端清理它：

我正在寻找使用 contentEditable 而不是 designMode iframe 的所见即所得编辑器列表。

我想要这个的原因是我想在我的网站上有一些用户可以编辑的区域（div），并且我想要样式（字体、字体颜色等）。在编辑区域中看起来与通常一样。我不想将样式表应用于所见即所得的 iframe。

有人知道任何轻量级、免费/开源的吗？

我不得不调试一个在 IE8 中失败的基于所见即所得 javascript 的 HTML 编辑器。它仅设计用于 IE，因此应该简化解决方案。这是失败的现有代码：

基本上发生的情况是，如果您选择一些文本并单击insert image它首先运行的按钮，则此isAllowed函数可以查看您选择的文本是否可编辑（即在 ContentEditable 的 iframe 内）。
这似乎在 IE8document.selection或createRange().

问题是，当您不使用鼠标选择任何文本并单击可编辑区域中的某个位置时，sel.createRange().parentElement()似乎会返回 iframe 之外的元素，因此它不是 ContentEditable 并且函数返回false。

我想知道是否有人可以深入了解 IE8 的选择和范围的实现发生了什么变化，这些变化会导致这种行为？

我有一个 contenteditable 设置为 true 的 div 来充当文本输入。现在通常，它会随着一些文本到达 div 的末尾而扩展，但是如果我调整 div 的大小，这种情况就不会发生。浏览器不再这样做。我尝试在将高度调整为自动后设置高度，但这也无济于事。

请帮我解决那个问题。谢谢。

我正在尝试自定义 jwysiwyg jquery RTE。我想构建一个图像属性编辑器，以便一旦将图像插入可编辑区域，用户就会选择它，然后会出现一个模式窗口或属性面板，允许用户编辑宽度/高度等。类似于 gmails图像插入 UI。

问题是我无法找出如何处理必要的图像点击事件。任何人都知道一些示例代码或一些我可以从哪里开始的信息？

是否有类似 Facebook 中的状态输入的类似输入？我的意思是，他们使用了一个内容可编辑的 div，而且他们已经把它包装得很好。他们可以调整它的大小（焦点/模糊），它会继续自动换行和扩展，当你在他们的输入中输入一个非常长的单词时，它不能被换行，它会留在 div 内并且不会与其他它附近的元素..

请帮我在一个可内容编辑的 div 上做这两件事，或者如果你知道一个准备好的，请分享。

谢谢。

PS我确实尝试过自己做，而不仅仅是懒惰。我几乎成功地停止了重叠，但在调整高度后没有设法使 div 保持 contenteditable(word-wrap,expandable)。我也想过尝试自己理解 Facebook 是如何做到的，但是对于新手来说，理解他们的代码非常困难，因为它们都被压缩和压缩了等等。

我有<div>一个contentEditable="true"。

当我在可编辑的 div 中复制粘贴内容时，粘贴的文本会被包裹到许多不需要的 CSS 中。

例如，这： <p>text text</p> 变成：

我理解浏览器（目前是谷歌浏览器）试图变得聪明，但我最终得到的是完全不相关和不需要的 CSS。

有没有办法告诉基于 WebKit 的浏览器不要生成这个？

我有一个 jQuery 对话框，用于在 contentEditable 范围内创建链接。问题是单击按钮打开对话框会导致选择丢失，对话框内的文本输入也会导致选择丢失。

我可以使用 -moz-user-select:none; 修复按钮 但是 -webkit-user-select:none 在 Chrome 中不起作用。

我可以通过将输入包装在 iframe 中来修复输入，但这很麻烦，单击其他任何地方也会终止选择，例如，拖动对话框。

我在打开 jQuery 对话框时如何保留文本选择中看到了解决方案，但这在许多浏览器中的 contenteditable 元素中不起作用，只有真正的输入。

我的问题有很好的解决方案吗？

我想要的是？

我想要一个像 div 一样工作的 div textarea，我不希望能够编辑 div 中的内容，以及粘贴图像等纯文本。

例子

www.facebook.com - 最好的例子是facebook 的新闻提要。

为什么我需要这种方式？

如果您查看 facebook 的新闻提要，您会发现可以撰写帖子的区域会随着您撰写帖子或点击大量输入而扩大。

这与我想使用带有 contentEditable 的 div 的原因相同，因为在 textarea 中我不能这样做。#

请不要 JQUERY 只有 JAVASCRIPT