检测是否支持事件监听器

发布于 2024-10-09 21:12:58 字数 163 浏览 0 评论 0原文

是否可以检测某些浏览器是否支持某些事件? 我可以检测浏览器是否支持 document.addEventListener,但我需要知道它是否支持事件 DOMAttrModified。 Firefox 和 Opera 支持它,但 Chrome 和其他浏览器不支持。

Is it possible to detect if certain events are supported in certain browsers?
I can detect if the browser supports document.addEventListener, but I need to know if it supports the event DOMAttrModified. Firefox and Opera support it, but Chrome and others do not.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

相思碎 2024-10-16 21:12:58

更新的答案

是的,您可以对此进行功能检测。创建一个元素,侦听事件,然后更改元素的属性。在我的测试中,您甚至不必将元素添加到 DOM 树中,这使得这是一个很好的、包含的特征检测。

示例:

function isDOMAttrModifiedSupported() {
    var p, flag;

    flag = false;
    p = document.createElement('p');
    if (p.addEventListener) {
        p.addEventListener('DOMAttrModified', callback, false);
    }
    else if (p.attachEvent) {
        p.attachEvent('onDOMAttrModified', callback);
    }
    else {
        // Assume not
        return false;
    }
    p.setAttribute('id', 'target');
    return flag;

    function callback() {
        flag = true;
    }
}

Live copy

Firefox 会针对上述所有修改触发回调; Chrome 没有一个。


原始答案

您可以通过功能检测是否支持某些事件,如这个方便的页面。我不知道您是否可以专门针对该测试进行测试,但如果可以,该代码很可能会帮助您入门。

更新:我将Kangax的代码转储到JSBin并尝试了它,看起来没有就像嗅探技术适用于该事件(除非我的名称拼写错误或其他什么;Firefox 显示“错误”)。但我上面的技术确实如此。

Updated answer:

Yes, you can feature-detect this. Create an element, listen for the event, and change an attribute on the element. In my tests, you don't even have to add the element to the DOM tree, making this a nice, contained feature detection.

Example:

function isDOMAttrModifiedSupported() {
    var p, flag;

    flag = false;
    p = document.createElement('p');
    if (p.addEventListener) {
        p.addEventListener('DOMAttrModified', callback, false);
    }
    else if (p.attachEvent) {
        p.attachEvent('onDOMAttrModified', callback);
    }
    else {
        // Assume not
        return false;
    }
    p.setAttribute('id', 'target');
    return flag;

    function callback() {
        flag = true;
    }
}

Live copy

Firefox triggers the callback on all of the modifications above; Chrome on none of them.


Original answer:

You can feature-detect whether some events are supported, as shown on this handy page. I don't know if you can test specifically for that one, but if you can, that code may well get you started.

Update: I dumped Kangax's code into JSBin and tried it, doesn't look like that sniffing technique works for that event (unless I have the name spelled incorrectly or something; Firefox is showing "false"). But my technique above does.

ゞ记忆︶ㄣ 2024-10-16 21:12:58
function isDOMAttrModifiedSupported () {
    var supported = false;
    function handler() {
      supported = true;
    }
    document.addEventListener('DOMAttrModified', handler);
    var attr = 'TEST';
    document.body.setAttribute(attr, 'foo'); // aka $('body').attr(attr, 'foo');
    document.removeEventListener('DOMAttrModified', handler);
    document.body.setAttribute(attr, null);
    return supported;
  }
function isDOMAttrModifiedSupported () {
    var supported = false;
    function handler() {
      supported = true;
    }
    document.addEventListener('DOMAttrModified', handler);
    var attr = 'TEST';
    document.body.setAttribute(attr, 'foo'); // aka $('body').attr(attr, 'foo');
    document.removeEventListener('DOMAttrModified', handler);
    document.body.setAttribute(attr, null);
    return supported;
  }
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文