检测对给定JavaScript事件的支持？

Question

我有兴趣使用JavaScript Hashchange事件来监视URL片段标识符中的更改。我知道 真正简单的历史 和此的jQuery插件。但是，我得出的结论是，在我的特定项目中，它实际上不值得另一个JS文件的开销。

我想做的是采用“渐进式增强”路线。也就是说，我想测试访问者的浏览器是否支持Hashchange事件，并在使用它的情况下编写我的代码作为增强功能而不是核心功能。 IE 8，Firefox 3.6和Chrome 4.1.249支持它，约占我网站流量的20％。

所以，嗯...是否有一些方法可以测试浏览器是否支持特定事件？

谢谢。

Answer 1

好吧，最好的方法不是经历浏览器嗅探，Juriy Zaytsev（@kangax）是检测事件支持的一种非常有用的方法：

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

用法：

if (isEventSupported('hashchange')) {
  //...
}

现在，此技术已在某些图书馆中使用 jQuery.

在这里阅读更多：

• 检测事件支持而无需浏览器嗅探

Answer 2

这 Mozilla文档 建议以下内容：

if ("onhashchange" in window) {
    alert("The browser supports the hashchange event!");
}

这在IE8和Chrome 5 Beta（我没有测试Chrome 4.1）中也有效，并且在Opera和Safari中正确失败。

Answer 3

这是对 CMS提供的答案, ，它不包含另一个功能，我认为这将有效：

function event_exists(eventName){
    if(typeof(eventName)!='string' || eventName.length==0)return false;
    var TAGNAMES = {
        'select':'input','change':'input',
        'submit':'form','reset':'form',
        'error':'img','load':'img','abort':'img'
    }
    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;
}