javascript - 如何使 contentEditable 在 iOS 5/iOS 6 下工作

Question

我目前正在开发一个 contenteditable iframe，到目前为止，它在除移动版 Safari 之外的所有浏览器下都能完美运行。我正在使用 iOS 5.1.1。该问题在任何支持 contentEditable 的 iOS 版本中都可以重现。

问题如下: 当您点击内容时，内容会正确聚焦，您可以移动光标和所有内容，但是一旦您对其应用操作，就会发生以下情况: 焦点仍在 iframe 中，您可以看到光标，但它不会像以前那样响应按键。没有任何反应，即使我移动光标并仍然尝试在其中键入任何内容。

这是一个发生的例子: http://www.quirksmode.org/dom/execCommand/

如果您将 iframe 聚焦在内容内的任何位置，并说您应用了文本右对齐。内容正确地右对齐，但如果您尝试键入任何其他字符，您会看到 ui 已锁定，但光标所在的位置不会出现新字符。如果您尝试应用不同的命令，它仍然可以工作。

有人知道我该如何解决这个问题吗？

Answer 1

您可以简单地使用 iframe 设计模式而不是 contenteditable 属性来使任何 HTML 元素可编辑。

使 iframe 中的元素可编辑的 javascript 代码是:

var iframe = document.getElementById ('the iframe Id ') ;
var doc = iframe.contentDocument || iframe.contentWindow.document;
doc.designMode = "on";

据我所知，在此方法中未发现跨浏览器问题

有关完整引用，请参阅 here