如何在没有浏览器检测的情况下识别"输入"事件中的错误行为？

Question

我将从问题开始.当一个特定的浏览器有一个错误的功能实现,你的javascript需要知道当前浏览器是否有错误的实现,所以它可以使用一个替代策略,如何在没有浏览器类型嗅探的情况下判断实现是否有错误(通常被认为是坏的)？

这是整个情况.

我正在研究一些想要使用"输入"事件来获取用户对<input type="text">字段的更改通知的代码(比"更改"事件更有效),但是当不支持该事件时,它会使用很多更复杂的方案涉及一堆其他事件.

由于"输入"事件仅在某些浏览器中受支持,因此我开始寻找一种方法来对事件进行特征检测(而不是浏览器用户代理嗅探),因为特征检测通常是一种更强大的操作方式.因此,我发现这篇伟大的文章正是为了做到这一点,这个代码似乎工作:

var isEventSupported = (function(){
    var TAGNAMES = {
      'select':'input','change':'input',
      'submit':'form','reset':'form',
      'error':'img','load':'img','abort':'img'
    }
    function isEventSupported(eventName) {
      var el = document.createElement(TAGNAMES[eventName] || 'div');
      eventName = 'on' + eventName;
      var isSupported = (eventName in el);
      if (!isSupported) {
        el.setAttribute(eventName, 'return;');
        isSupported = typeof el[eventName] == 'function';
      }
      el = null;
      return isSupported;
    }
    return isEventSupported;
  })();

然后,我遇到了IE的问题(惊喜,惊喜).虽然IE声称支持"输入"事件并且它通过上面的功能测试并且它大部分时间都可以工作,但是IE的支持是如此糟糕.当用户点击退格键(以及其他缺少的行为)时,它甚至不会触发事件.因此,我不能在IE中依赖它.所以,我已经构建了这个很好的干净代码,它为"输入"事件做了一个功能测试,并且当它存在时使用它非常干净的实现,当不存在时使用这个更加丑陋的解决方案涉及监视其他八个事件.现在,它已经在IE中被破坏了,因为"输入"事件的功能测试通过,所以代码试图使用它,但它有点像地狱,所以它不起作用.

由于这些IE错误出现在用户操作上,我想不出任何方法来设计一个javascript功能测试来识别错误的行为.因此,我唯一的当前途径是使用浏览器嗅探,如果浏览器是IE,则拒绝依赖"输入"标记.

除了浏览器嗅探之外,这里是否有任何选项可用于识别"输入"事件中的错误行为？如果必须进行浏览器嗅探,是否有办法通过行为来识别IE而不是可以自由欺骗并且不保证准确的用户代理字符串？

Answer 1

如果您对跨浏览器“输入更改”事件感兴趣，这是我的实现：

function onInputChange(domInput, callback) {
    if (domInput.addEventListener) {
        domInput.addEventListener('input', callback, false); // Firefox, etc.
    } else if (domInput.attachEvent) {
        domInput.attachEvent('onpropertychange', callback); // IE
    }
}

使用示例：

var leInput = document.getElementById('myInput');
var leCallback = function () {
    // awesome stuff here
};

onInputChange(leInput, leCallback);

适用于所有浏览器，支持键盘输入和复制/粘贴。

然而，有一个例外，那就是那个该死的 IE9，在我编写上面的代码时它还不存在。微软会考虑修复他们的错误吗？:\