如何测试是否支持onpropertychange

How to test if onpropertychange is supported or not?

本文关键字:是否 支持 onpropertychange 测试 何测试      更新时间:2023-09-26

我想知道输入元素是否发生了变化,我了解到我可以在IE中收听onpropertychange,在其他浏览器中收听oninput
下面是我的代码:

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;
};

现在我想将input.onpropertychange = input.oninput = oninput;更改为addEventListernerattachEvent,我需要检查是否支持onpropertychange事件,我该如何做到这一点(没有浏览器检测)?

您可以使用in操作符进行检查:

"onpropertychange" in input

这种特性测试在旧版本的Firefox中不起作用,旧版本的Firefox会报告与存在的事件对应的事件处理程序属性的false事件,但这在这里不是问题,因为Firefox目前不支持propertychange事件,将来也不太可能支持。

这里有一些背景:http://perfectionkills.com/detecting-event-support-without-browser-sniffing/

另一点:您需要单独的函数来处理propertychangeinput事件,因为在propertychange处理程序中,您需要检查是否是value属性发生了更改。否则,您将最终处理输入的任何属性的更改。

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