无法在 Internet Explorer 中打开 designMode答案

【问题标题】：Can't switch on designMode in Internet Explorer无法在 Internet Explorer 中打开 designMode
【发布时间】：2010-05-17 15:55:56
【问题描述】：

以下代码适用于 Firefox 3.6，但不适用于 Internet Explorer 8：

<html>
<head>
   <title>Example</title>
   <script type="text/javascript">
      function init() {
         alert(document.designMode);
         document.designMode = "on";
         alert(document.designMode);
      }
   </script>
</head>
<body onload="init()">
</body>
</html>

在 FF 中，警报显示“关闭”，然后显示“开启”；在 IE 中，它们都是“关闭”。

我做错了什么？

【问题讨论】：

标签： javascript internet-explorer firefox designmode

【解决方案1】：

尽管这不会改变警报显示的内容，但它会在 IE 中打开可编辑模式：

<html>
<head>
   <title>Example</title>
   <script type="text/javascript">
      function init() {
         alert(document.designMode);
         document.designMode = "On";
         document.body.contentEditable = 'true';
         alert(document.designMode);
      }
   </script>
</head>
<body onload="init()">
</body>
</html>

您可以通过在页面正文中放置一些虚拟内容（如<p>Test</p>）并在 FF 和 IE 中加载来进行测试。对于至少 IE8，这是一个合适的解决方法。

【讨论】：

contentEditable 可以解决问题！（无论如何，警报只是用于调试。）TVM。

【解决方案2】：

在 IE 中使用contentEditable 属性可能会更好，尽管designMode 是标准。

【讨论】：

【解决方案3】：

Internet Explorer documentation 似乎表明designMode 属性区分大小写，需要设置为"On"，而不是"on"。

【讨论】：

不，这并没有解决问题。顺便说一句，如果我使用像“xx”这样的无意义值，则赋值会引发异常，所以我的猜测是“on”和“On”被视为相同。
嗯，值得一试。我敢打赌 EAMann 的答案是一个不错的解决方法。
我实际上已经读到，对 designMode 属性的支持最终会被 contentEditable 方法所取代。显然它们的功能有所不同，对contentEditable 的跨浏览器支持比designMode 更深。不过，在标准专家做出正式呼吁之前，我们可能应该将两者都考虑在内。