2

I'm trying to create a custom Event in JavaScript.

I have a WPF applciation with a WebBrowser that run Internet Explorer 9.

The code :

var evt = document.createEvent("Event");

evt.initEvent("readerstatechanged", true, false);
window.dispatchEvent(evt);

Error :

enter image description here

I also tried :

var evt = new Event("Event");

Error :

enter image description here

Do you have an idea how to create a custom event with IE 9 ?

Edit :

I changed with createEventObject, but then the "InitEvent" doesn't work :

            var evt = document.createEventObject("Event");

            evt.initEvent("printerstatechanged", true, false);
            window.dispatchEvent(evt);

Then I need to use attachEvent like this :

            window.attachEvent('printerstatechanged', function (e) {
                //Do something
            });
Gab
  • 1,861
  • 5
  • 26
  • 39
  • Why do you need to do this? – Cerbrus Apr 29 '14 at 10:00
  • Complicated to explain but i need it. And it works if I change the version of the Browser for IE11 but unfortunately I need the IE 9 support... – Gab Apr 29 '14 at 10:04
  • Can you try to explain it? Maybe the problem can be solved differently. – Cerbrus Apr 29 '14 at 10:06
  • See my other post : http://stackoverflow.com/questions/23344625/create-javascript-custom-event/23344816 I thought II found the solution but I finally need the support of IE9 – Gab Apr 29 '14 at 10:09

1 Answers1

4

IE9 supports DOM3 events, so you can create and hook custom events. Here's a complete example, which works in IE9 and any other DOM3-compatible browser: Live Copy

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>IE9+ Custom Event</title>
</head>
<body>
  <script>
    (function() {
      // Hooking the event, in this case on documentElement
      document.documentElement.addEventListener("readerstatechanged", function() {
        display("readerstatechanged received");
      });

      // Creating it
      display("Creating");
      var evt = document.createEvent("CustomEvent");
      evt.initCustomEvent("readerstatechanged", true, false, {});
      // Could put custom data here -------------------------^^

      // Firing it on documentElement
      display("Firing");
      document.documentElement.dispatchEvent(evt);

      function display(msg) {
        var p = document.createElement('p');
        p.innerHTML = String(msg);
        document.body.appendChild(p);
      }
    })();
  </script>
</body>
</html>

It will not work in IE8, but as you've emphasized IE9...

If your site is being displayed in the seriously-misnamed "compatibility view," IE turns off these standard features, making it less compatible with the real world rather than more. Using "compatibility view" for intranet sites is the default setting, I believe, which is just asinine. You can reassure IE that you actually know what you're doing by adding a meta tag to your head section:

<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
T.J. Crowder
  • 1,031,962
  • 187
  • 1,923
  • 1,875
  • Thank you for the answer! But It doesn't recognize "AddEventListerner" and "createEvent*. I'using a WPF WebBrowser and the user agent is : "Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.3; WOW64; Trident/7.0)" Should it works ? – Gab Apr 29 '14 at 11:03
  • I am using "9999 (0x270F)" from http://weblog.west-wind.com/posts/2011/May/21/Web-Browser-Control-Specifying-the-IE-Version But nevermind, I'll use the IE10 compatibility for now... thanks again – Gab Apr 29 '14 at 11:12
  • @Gab: You need to make sure the browser isn't in "compatibility view" (which bizarrely removes features like `addEventListener`, making the browser **less** compatible, not more). Add `` to your `head` section; [more here](http://stackoverflow.com/questions/3726357/why-does-ie9-switch-to-compatibility-mode-on-my-website). Asinine, eh? – T.J. Crowder Apr 29 '14 at 11:12
  • 1
    "" works! thanks – Gab Apr 29 '14 at 11:14