3

更新：这已被确定为 Chrome 中的错误。（感谢@michael-robinson）

在 Chrome（至少 v22）中，我注意到即使在 contentEditable 被禁用后，拼写检查“红色波浪”下划线仍可能保留。

我做了一个 jsfiddle 来演示：jsfiddle demo。

曲线和拼写错误

即使我spellcheck="false"在禁用之前设置了属性contentEditable，它们仍然存在。

任何人都知道解决或解决此问题的好方法吗？理想情况下，当内容可编辑时，我会保留内置的拼写检查功能。

4

5 回答 5

3

您是否尝试过设置display: none（使用 CSS）然后将显示设置回原来的样子？可能会强制 Chrome 重新绘制元素...（不起作用，请参阅下面的其他解决方案）

或者，您可以创建元素的副本（但禁用 contenteditable）将其放置在原始元素之后并删除原始元素。

更新 1：第一个解决方案不起作用，但第二个解决方案起作用。更新了 JSfiddle http://jsfiddle.net/RegVn/6/

更新 2：上面的解决方案使用 innerHTML 删除破坏事件处理程序。它还破坏了选择/插入符号的位置。

新方法使用 jQuery 的clone()方法（在深度克隆模式下）创建对象的副本（复制事件处理程序），并具有自定义函数来保存对选择的引用，然后恢复它。请注意，选择保存/恢复功能在 ie6-8 中不起作用，但我认为这是可以接受的，因为问题被标记为 Chrome。更新 JSfiddle：http: //jsfiddle.net/RegVn/23/

于 2012-10-11T12:19:23.830 回答
3

将属性添加spellcheck="false"到元素对我有用。

于 2017-06-22T18:57:32.220 回答
1

spellcheck 属性指定是否要检查元素的拼写和语法：

拼写检查 =“假”

于 2012-10-10T16:01:58.067 回答
1

如果您更新元素的 innerHTML，拼写检查将被重新评估，因此spellcheck="false"如果元素不可编辑，它们就会消失。

例如：

myElement.innerHTML = myElement.innerHTML + " "; // add a space to force a change.

这有很大的缺点：

  • 引用任何元素的事件处理程序和 javascript 对象都将失效（元素内的所有元素都有效地从 dom 中删除）。这也意味着仅 javascript 的属性，例如复选框的indeterminate属性或任何其他自定义属性，将被销毁。
  • 选择或插入符号位置被破坏。
  • 如果你有大量的内容，这对 cpu 来说是一项不平凡的操作，尤其是在移动设备上。

现在还可以，但我仍在寻找更好的答案。建议？

于 2012-10-15T01:13:07.240 回答
0 
var content = $("#editor").html();
$("#editor").html("")
$("#editor").attr('spellcheck', 'false');
$("#editor").html(content);

试试这个代码，它应该可以工作。这是基于与克隆内部 HTML 相同的先前答案。

适用于 FF 和 Chrome。

于 2013-11-04T00:15:47.513 回答