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

How to make contentEditable work under iOS 5/iOS 6

本文关键字：iOS 6下 工作 contentEditable 何使      更新时间：2024-01-02

我目前正在开发一个内容可编辑的iframe，到目前为止，它在除移动Safari之外的所有浏览器下都能完美工作。我使用的是iOS 5.1.1。该问题在最新版本的支持contentEditable的任何iOS版本中都是可复制的。

问题如下：当你点击内容时，内容会正确聚焦，你可以移动光标和所有东西，但一旦你对其应用了操作，就会发生以下情况：焦点仍然在iframe中，您可以看到光标，但它不像以前那样响应keydown。即使我移动了光标，仍然试图在里面键入任何内容，也不会发生任何事情。

以下是发生的情况的示例：http://www.quirksmode.org/dom/execCommand/

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

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

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

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

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

当我读到在这个方法中没有发现跨浏览器的问题

有关完整参考，请参阅此处

升级您的iOS版本是一个选项吗？我刚刚使用iOS 6.1测试了您描述的所有条件，没有出现任何问题。

由于iOS5是第一个支持内容可编辑的iOS Safari版本，因此该实现可能包含错误。它似乎已经成熟了。

iOS 5.1.1支持HTML5的最低功能。在您将其更新到iOS7后，它将运行良好。

相关文章：