问题标签 [contenteditable]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
4 回答
13892 浏览

javascript - 在 Javascript contenteditable div 中插入文本

有没有办法将文本(字符串,可能有也可能没有 html 标签)插入到div?

它必须是 adiv而不是 a textarea

首先,我需要获取光标位置,然后在该位置插入文本。它类似于 function insertAdjacentText,但它只能在标签之前或之后插入,并且只能在 IE 中使用。

请参阅此 URL:http: //yart.com.au/test/iframe.aspx。注意如何将光标定位在 div 中,我们需要在光标位置添加文本。

0 投票
6 回答
13852 浏览

image - Firefox - designMode:禁用图像大小调整句柄

如何防止用户在 designMode 中调整图像大小?(单击图像时禁用手柄)

0 投票
11 回答
49315 浏览

javascript - 防止 contentEditable 中的换行符/段落符

在 Firefox 中使用 contentEditable 时,有没有办法防止用户通过按 enter 或 shift+enter 来插入段落或换行符?

0 投票
3 回答
1734 浏览

html - 为什么 contentEditable 元素拒绝 Enter 键?

我正在使用嵌入 IE 控件来显示内容的应用程序。我将该内容更改为包含一个<div contentEditable="True">Hello World</div>元素。这很好用,我可以编辑这个 div 的内容,但是按 Enter 会被拒绝并发出哔声。

当我向该页面添加 textarea 元素时,Enter 键起作用,我可以添加行,但不能在 contentEditable 元素中添加。

当我将事件附加到该元素时,我看到按下 Enter 键会触发 keyDown 事件,但不会触发 keyPress。

任何人都知道可能导致它的原因吗?

谢谢,
刺客

0 投票
6 回答
23018 浏览

javascript - 在 IE 中使用 contentEditable 的风险

我们必须为我们的产品添加一个基本的 HTML 编辑器。由于我们目前只支持 IE(大多数客户仍在使用 IE 6),我被告知要使用 Internet Explorer 内置的 XHTML 编辑功能——例如<div contentEditable="true">,如“编辑网页”中所述。

除了不能在其他浏览器中工作。(管理层不认为有问题。我们的客户会忍受我们的软件只在IE下工作。我们的软件只在IE下工作,我们从来没有亏过钱;大多数客户目前只会让他们的员工使用IE6 )

使用 contentEditable 我们可能会遇到什么其他问题?


更新

我用“contentEditable”编写的 HTML 编辑器被证明很难获得可靠,有很多问题。如果我必须再次这样做,我会非常努力地使用众多开源解决方案之一(例如 TinyMCE),或者购买支持的 HTML 编辑器。

毫无疑问,只要有足够的时间,一个非常熟练的 jscript 程序员可以让“contentEditable”正常工作。只是网络上的所有示例看起来都很简单,直到您测试常见操作,例如从单词中剪切/粘贴并尝试编辑生成的 HTML。(只是客户会做的事情)

(只需在 stackoverflow 上搜索“contentEditable”即可了解其他人遇到的问题)

0 投票
3 回答
1207 浏览

firefox - 可在 XML/复合文档中的节点上编辑内容?

我有一个在 Web 浏览器中显示的 XML 文档,并附有样式表:

使用 xhtml 命名空间声明和 xhtml:script 标签,我可以执行 javascript。

我想做的是使此文档内容中的任意非 XHTML 元素可编辑。(实际上,它们将在另一个命名空间中)

即使我明确添加了@contentEditable="true"(即不使用Javascript),内容实际上也不是可编辑的(在Firefox 3.0.4 中)。

是否可以在任何当前浏览器中编辑它?(在 XHTML 1.0 过渡文档中,我对<div contentEditable="true">Edit me >没有任何问题)</div

我什至无法在此文档中编辑 xhtml:div(在 Firefox 中);如果我能做到这一点,那可能会提供一条前进的道路。

0 投票
6 回答
11619 浏览

iphone - 为什么@contenteditable 在 iPhone 上不起作用?

Safari HTML 参考:支持的属性说:

内容可编辑

如果为 true,则可以动态编辑元素;如果为假,则不能。

可用性

在 Safari 1.2 及更高版本中可用。适用于 iPhone OS 1.0 及更高版本。

但是,在我的 iPhone 上,我无法让它工作。有人在这方面取得成功吗?

您可以使用此文档进行尝试(诚然不是纯 html,但该文档适用于桌面 Safari、Chrome 和 Firefox 3)。我什至无法在移动 Safari 中编辑最简单的 html 文档。

0 投票
1 回答
3144 浏览

keyboard-events - contenteditable div中子元素的键盘事件?

我有一个 div,其 contenteditable 属性已设置为 true。如何让孩子响应键盘事件?似乎唯一的方法是捕获父 div 中的事件并通过选择 api 找出孩子。有没有更好的办法?更具体地说,我可以将键盘事件处理程序附加到子元素吗?我错过了什么吗?

附件是说明问题的示例代码。希望代码中的注释足以解释。

0 投票
2 回答
2441 浏览

php - jquery contenteditable 换行符

我有一个内容可编辑区域,我正在尝试禁用输入/返回并从创建新段落中切换输入,我可以使用下面的脚本,但它会一起禁用按钮,我想要做的只是返回放置一个换行符而不是转到一个新段落。

所有帮助表示赞赏!

干杯,

瓦扎

0 投票
5 回答
10768 浏览

javascript - Javascript - 更改文本区域中某些文本的字体颜色

是否有任何可以更改文本区域中某些文本颜色的 JS 函数?

例如,blar blar {blar} blar、{blar},包括 { },将是蓝色的。其他字为空白。换句话说,我所需要的只是一个可以改变 { } 中所有文本颜色的函数。

我做了一些研究,似乎大多数人都说做不到。但我看到富文本编辑器或那些所见即所得的编辑器能够加粗或下划线。必须有办法做到这一点。

欢迎任何建议。