How to check if onpropertychange is supported or not?

Question

I would like to know if the input element has changed, I found out that I can listen to onpropertychange in IE and oninput in other browsers.
Here is my code:

 var _addChangedProperty = function(input){ input.changed = false; var oninput = function(){ this.changed = !!this.value; if(this.changed){ this.style.color = "black"; } }; input.onpropertychange = input.oninput = oninput; }; 

Now I would like to change input.onpropertychange = input.oninput = oninput; on addEventListerner and attachEvent , I need to check if the onpropertychange event is onpropertychange , how can I do this (without detecting the browser)?

Answer 1

You can check with the in operator:

 "onpropertychange" in input 

This function tester does not work in older versions of Firefox that report false event handler events for events corresponding to events, but this is not a problem because Firefox does not currently support the propertychange event and is unlikely to be in the future.

Here is some background: http://perfectionkills.com/detecting-event-support-without-browser-sniffing/

Another point: you need separate functions for handling propertychange and input events, because in the propertychange handler you need to check if this value property has changed. Otherwise, you will handle changes to any input property.

 input.onpropertychange = function(evt) { evt = evt || window.event; if (evt.propertyName == "value") { // Do stuff here } };