addEventListener in Internet Explorer

Question

What is the equivalent to the Element Object in Internet Explorer 9   if   Element prototype addEventListener        Element prototype addEventListener   function                How does it works in Internet Explorer   If there s a function equal to addEventListener and I don t know  explain please    Any help would be appreciated  Feel free to suggest a completely different way of solving the problem

User · Answer

EDIT

I wrote a snippet that emulate the EventListener interface and the ie8 one, is callable even on plain objects: https://github.com/antcolag/iEventListener/blob/master/iEventListener.js

OLD ANSWER

this is a way for emulate addEventListener or attachEvent on browsers that don't support one of those
hope will help

(function (w,d) {  // 
    var
        nc  = "", nu    = "", nr    = "", t,
        a   = "addEventListener",
        n   = a in w,
        c   = (nc = "Event")+(n?(nc+= "", "Listener") : (nc+="Listener","") ),
        u   = n?(nu = "attach", "add"):(nu = "add","attach"),
        r   = n?(nr = "detach","remove"):(nr = "remove","detach")
/*
 * the evtf function, when invoked, return "attach" or "detach" "Event" functions if we are on a new browser, otherwise add "add" or "remove" "EventListener"
 */
    function evtf(whoe){return function(evnt,func,capt){return this[whoe]((n?((t = evnt.split("on"))[1] || t[0]) : ("on"+evnt)),func, (!n && capt? (whoe.indexOf("detach") < 0 ? this.setCapture() : this.removeCapture() ) : capt  ))}}
    w[nu + nc] = Element.prototype[nu + nc] = document[nu + nc] = evtf(u+c) // (add | attach)Event[Listener]
    w[nr + nc] = Element.prototype[nr + nc] = document[nr + nc] = evtf(r+c) // (remove | detach)Event[Listener]

})(window, document)

User · Answer

John Resig  author of jQuery  submitted his version of cross-browser implementation of addEvent and removeEvent to circumvent compatibility issues with IE s improper or non-existent addEventListener   function addEvent  obj  type  fn       if   obj attachEvent         obj  e  type fn    fn      obj type fn    function   obj  e  type fn   window event         obj attachEvent   on  type  obj type fn         else     obj addEventListener  type  fn  false      function removeEvent  obj  type  fn       if   obj detachEvent         obj detachEvent   on  type  obj type fn         obj type fn    null      else     obj removeEventListener  type  fn  false        Source  http   ejohn org projects flexible-javascript-events

User · Answer

I m using this solution and works in IE8 or greater   if  typeof Element prototype addEventListener      undefined         Element prototype addEventListener   function  e  callback          e    on    e        return this attachEvent e  callback                And then    lt button class  click-me  gt Say Hello lt  button gt    lt script gt    document querySelectorAll   click-me   0  addEventListener  click   function          console log  Hello           lt  script gt    This will work both IE8 and Chrome  Firefox  etc

User · Answer

I would use these polyfill https   github com WebReflection ie8   lt  -- if IE 8  gt  lt script   src    cdnjs cloudflare com ajax libs ie8 0 2 6 ie8 js   gt  lt  script gt  lt   endif -- gt

User · Answer

Here s something for those who like beautiful code   function addEventListener obj evt func       if   addEventListener  in window           obj addEventListener evt func  false         else if   attachEvent  in window    IE         obj attachEvent  on  evt func             Shamelessly stolen from Iframe-Resizer

User · Answer

addEventListener is supported from version 9 onwards  for older versions use the somewhat similar attachEvent function

User · Answer

As Delan said  you want to use a combination of addEventListener for newer versions  and attachEvent for older ones    You ll find more information about event listeners on MDN   Note there are some caveats with the value of  this  in your listener     You can also use a framework like jQuery to abstract the event handling altogether        someelementid   bind  click   function  event          etc      this  is whetver caused the event

User · Answer

addEventListener is the proper DOM method to use for attaching event handlers   Internet Explorer  up to version 8  used an alternate attachEvent method   Internet Explorer 9 supports the proper addEventListener method   The following should be an attempt to write a cross-browser addEvent function   function addEvent evnt  elem  func       if  elem addEventListener      W3C DOM       elem addEventListener evnt func false      else if  elem attachEvent       IE DOM       elem attachEvent  on  evnt  func           else      No much to do       elem  on  evnt    func

[javascript] addEventListener in Internet Explorer

Examples related to javascript

Examples related to internet-explorer

Examples related to internet-explorer-9

Examples related to addeventlistener