Can't switch on designMode in Internet Explorer

The following code works in Firefox 3.6, but not in 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>

In FF the alerts show 'off', then 'on'; in IE they're both 'Off'.

What am I doing wrong?

Answers


Even though this won't change what the alerts show, it will turn on an editable mode in 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>

You can test by placing some dummy content in the page body (like <p>Test</p>) and loading in both FF and IE. It's a suitable workaround for at least IE8.


You may have better luck with the contentEditable attribute in IE, though designMode is the standard.


The Internet Explorer documentation seems to indicate that the designMode property is case-sensitive, and needs to be set to "On", not "on".


Need Your Help

Difference between passing string and images through intents(in term of memory usage)

android image android-intent bitmap

In my application, I have several images downloaded from the internet and when I click on those images, the images will be pass to an image viewer (a new activity). In term of memory usage, which i...

Using async library to assemble all tags from database

javascript node.js asynchronous collections sails.js

I am using sails.js to create a tag system that has many-to-many relations with an entity called Post. The way I am doing the association is to use a database table to correlate each tagId with the