addEventListener代码片段的转换和跨浏览器检测的用法 [英] addEventListener Code Snippet Translation and Usage for cross-browser detectioin

问题描述

我遇到了一段我想建模的代码。但是，我有几个问题，也许你们可以帮忙。代码如下：

I've come across a piece of code that I'd like to model. However, I just have a few questions and perhaps you guys can help. Here's the code:

function addEvent( brw_obj, type, func ) {

if (brw_obj.addEventListener) { // all browsers except IE < v9
 brw_obj.addEventListener( type, func, false );

} else if (brw_obj.attachEvent) { // IE only for v < v9
 brw_obj["e"+type+func] = func;
 brw_obj[type+func] = function() { 
     brw_obj["e"+type+func]( window.event ); 
    }
 brw_obj.attachEvent( "on"+type, brw_obj[type+func] );
}

/* else if (brw_obj.captureEvents) {
  brw_obj.captureEvents(Event.CLICK); // only works with FF < v3!
}
*/

}

现在，我在某种程度上了解代码正在检查addEventListener或attachEvent;但是以下几行详细说明了什么？我还没有看过这样写的javascript：

Now, I understand somewhat that the code is checking for addEventListener or attachEvent; but what do the following lines mean in detail? I've haven't seen javascript written like this:

brw_obj["e"+type+func] = func;
brw_obj[type+func] = function() { 
brw_obj["e"+type+func]( window.event ); 
 }
brw_obj.attachEvent( "on"+type, brw_obj[type+func] );

此外，使用此代码是进行浏览器或对象检测的好方法吗？

Also, is using this code a good way of doing browser or object detection?

我正在编写脚本，需要确保它可以在所有现代浏览器以及旧浏览器上运行。据我了解，大多数现代浏览器都支持addEventListener和IE支持attachEvent。我不确定是旧版浏览器是否支持这两种。

I'm writing a script and need to be sure it runs on all modern browsers as well as old ones. From what I understand, most modern browsers support addEventListener and IE supports attachEvent. What I'm not sure is if older browsers support either.

至注释行：

/* else if (brw_obj.captureEvents) {
 brw_obj.captureEvents(Event.CLICK); // only works with FF 
}
*/

我在某处读到只有旧版的Firefox浏览器才支持captureEvents。在整个代码的上下文中，是否需要这些行？

I read somewhere that captureEvents is only supported by older Firefox browsers. In the context of the entire code, are these lines needed?

任何人都可以接受所有有见地的评论，批评和建议。谢谢！ ：）

Any and all insightful comments, critiques, and advice is welcome. Thanks! :)

推荐答案

一段时间以来，我一直在使用try / catch方法，对于我当前的项目来说，它的工作情况还不错。请查看以下代码段：

I have been using the try/catch approach for a while and it's been working just fine for my current projects. Please have a look at the following code snippet:

var request;

try {
    request = new XMLHttpRequest(); // standard
}
catch (e) {
    request = new ActiveXObject("Microsoft.XMLHTTP"); // workaround
}

以上示例应适用于所有返回Internet Explorer 5.0的浏览器;当然，您不能支持所有古老的浏览器，但是，无论如何，Mosaic都不讲JavaScript。

The above sample should work on all browsers back to Internet Explorer 5.0; Of course, you can't support all ancient browsers, but hey, Mosaic didn't talk JavaScript, anyway.

因此，您可以尝试调用addEventListener和如果您捕获错误，则可以调用attachEvent。

So, you could "try" to call addEventListener and if you "catch" an error you could then call attachEvent.

仅$ 0,02。

I最近我自己面对了addEventListener问题，所以这是我目前的处理方法：

I've recently faced the addEventListener issue myself, so here's my current approach on the matter:

function addEventListener(target, type, listener) {
    if (target) {
        if (target.addEventListener) {
            target.addEventListener(type, listener, false);
        }
        else if (target.attachEvent) {
            target.attachEvent("on" + type, listener);
        }
    }
    else {
        throw new Error("Can't addEventListener: target object is null.");
    }
}

然后，您只需调用新的addEventListener函数即可，不管浏览器支持什么。

Then you just call the new addEventListener function, which carries away with whatever the browser supports.

这篇关于addEventListener代码片段的转换和跨浏览器检测的用法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！