0

I have this javascript code:

   initializeEventHandlers: function() {
      if ( typeof document.implementation != "undefined" &&
         document.implementation.hasFeature("HTML",   "1.0") &&
         document.implementation.hasFeature("Events", "2.0") &&
         document.implementation.hasFeature("CSS",    "2.0") ) {
         document.addEventListener("mouseup",   this._mouseUpHandler.bindAsEventListener(this),  false);
         document.addEventListener("mousemove", this._mouseMoveHandler.bindAsEventListener(this), false);
      }
      else {
         document.attachEvent( "onmouseup",   this._mouseUpHandler.bindAsEventListener(this) );
         document.attachEvent( "onmousemove", this._mouseMoveHandler.bindAsEventListener(this) );
      }
   }

That works in most browsers, but when I use IE11 it fails. I know this is because IE11 removed support for attachEvent, and IE11 falls through to the else condition. I also see that hasFeature is deprecated, so I am not sure how best to detect addEventListner support.

2
  • What is the oldest browser that you have to support? Commented Sep 1, 2016 at 13:25
  • note: document.implementation.hasFeature is deprecated, and always returns true in many cases :p Commented Sep 1, 2016 at 13:26

2 Answers 2

1

The following code works for IE11 and Firefox, but will it work for other/older browsers?

   initializeEventHandlers: function() {
      if (document.addEventListener) { 
         document.addEventListener("mouseup",   this._mouseUpHandler.bindAsEventListener(this),  false);
         document.addEventListener("mousemove", this._mouseMoveHandler.bindAsEventListener(this), false);
      }
      else if (document.attachEvent) {
         document.attachEvent( "onmouseup",   this._mouseUpHandler.bindAsEventListener(this) );
         document.attachEvent( "onmousemove", this._mouseMoveHandler.bindAsEventListener(this) );
      }
   }
Sign up to request clarification or add additional context in comments.

2 Comments

This is the typical way of checking this (note addEventListener being checked first as the standard-compliant thing, and then old-IE-specific case later). It should work in basically all browsers except maybe ones from two decades ago.
0

The robust and safe way to see if document accepts the method is to use "try { ... } catch (err){ ... }" construction:

const initializeEventHandlers = () => {
  try {      
    if (document.addEventListener) { 
       document.addEventListener("mouseup",   this._mouseUpHandler.bindAsEventListener(this),  false);
       document.addEventListener("mousemove", this._mouseMoveHandler.bindAsEventListener(this), false);
    }
    else if (document.attachEvent) {
       document.attachEvent( "onmouseup",   this._mouseUpHandler.bindAsEventListener(this) );
       document.attachEvent( "onmousemove", this._mouseMoveHandler.bindAsEventListener(this) );
    }
  }
  catch(err) {
    console.info('Error', err );
  }   
}

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.