问题标签 [contenteditable]

我想尝试以下用户界面：
1. 内容由引号和评论组成。
2.评论是可编辑的，而引号是不可编辑的。但是，引用应该能够使引用的部分突出显示、加粗等。
3. 整个文本（包括引用和评论）应该能够被选择并作为富文本复制出来。最好可以删除包含其中的任何引用的选择（尽管如果选择在引用中间停止，这可能会很有趣）。
4. 引用和注释的突出显示功能等最好是相似的（可能是文本区域上方带有粗体、斜体等图标的工具栏）。

我尝试使用 contenteditable div 和使用 contenteditable=false 元素的引号来执行此操作。下面是一个例子

然而，我发现虽然 Chrome（可能是 WebKit）允许您在 contenteditable 元素的只读部分中选择文本，但 Firefox 只允许您将 contenteditable 视为一个大块并一次全部选择。有没有办法解决？有没有更好的方法来做我建议的事情？

我有一个<div contenteditable=true>我通过所见即所得定义一些元素的地方。例如<p>，<h1>等。我想直接将重点放在其中一个元素上。

例如在<p id="p_test">. 但似乎该focus()功能不适用于<div>元素，<p>元素......

在我的情况下，是否有另一种方法来定义焦点？

我试图解释我的问题。

我有一个<div contenteditable="true" id="my_editeur>，我在其中定义了一个按键“事件”，它允许我在用户单击“输入”时添加一个“p”。

它运行良好，但我想在这个新的“p”元素上定义光标，因为目前我的光标停留在第一个“p”元素上。

我曾尝试使用 jquery 焦点功能，但似乎我们不能将此功能用于“p”元素。

你知道我该怎么做才能解决我的问题吗？

非常感谢您的帮助。

我的代码：

Does anyone have any suggestions on how to edit an link in a contentEditable div? It would be ideal once the link is either clicked with mouse, or the cursor hits the link, that the a small prompt would pop up and allow the user to change the href property of the link. The prompt isn't the issue, but how is it possible to detect the link has been either clicked or that the cursor has arrived at the link? onfocus doesn't seem to work in a contentEditable div on Firefox & Safari. Any ideas?

是否可以使 contenteditable 元素中的部分永久化，以便用户无法删除它？

我在 contentEditable div 中有一个 h2 标签。我不希望用户编辑 h2 标签，所以我设置了 contentEditable=false，但用户仍然可以选择和删除它，我想禁止它。

所以，例如：

我正在探索在网站上的访问者评论和留言板上使用 contenteditable 的想法。

由于我只希望接受 HTML 标签和属性的白名单，因此出现了我应该何时以及如何验证输入的 HTML 内容的问题。

你会怎么做？您会选择使用哪些跨浏览器解决方案？哪些事件可能有用？

我正在尝试在 contenteditable div 层中设置插入符号的位置，经过一番搜索网络和试验后，我使用它在 Firefox 中工作：

但在 Chrome/webkit 中，它会选择 div 中的所有内容。这是 webkit 的错误还是我做错了什么？
先感谢您。

<div contenteditable="true"> </div>当在 Firefox中按 enter 时<br />产生 - 没关系。但是在 Chrome 或 IE 中创建了一个新的<div>or <p>。我应该怎么做才能让 Chrome 和 IE 表现得像 Firefox 一样。

我有一个可以编辑的表格，当你完成编辑后，我有一个简单的代码保存该列表。

（表格上有 contenteditable ）

我偶然发现的问题是，如果我双击回车，表格会分成两个具有相同 ID 的单独表格。这导致我用来设置 localStorage 的代码只存储一个表（我假设是第一个）.. 我想到了不同的解决方案，我想知道是否有人可以指出优缺点（如果解决方案甚至可以工作）。

1. 创建一个循环，检查表后的页面并将它们存储到 localStorage-items 数组中。我必须为每个表动态创建一个 localStorage 项目。

2. 获取表格所在的整个 div，并将其存储在 localStorage 中，当用户重新访问页面时，页面会检查存储中的项目并显示整个 div。

3. 你有任何可以打败这个的建议:)..（但没有缓存，它必须与 localStorage 一起使用！）

我正在开发一个 jQuery 插件，它允许你做@username样式标签，就像 Facebook 在他们的状态更新输入框中所做的那样。

我的问题是，即使经过数小时的研究和实验，简单地移动插入符号似乎真的很困难。我已经设法在<a>标签中注入了某人的名字，但是将插入符号放在它之后看起来像是火箭科学，特别是如果它应该在所有浏览器中都可以工作。

而且我什至还没有考虑用@username标签替换键入的文本，而不仅仅是像我现在所做的那样注入它......哈哈

在 Stack Overflow 上有很多关于使用 contenteditable 的问题，我想我已经阅读了所有这些问题，但它们并没有真正涵盖我需要的内容。因此，任何人都可以提供更多信息会很棒:)