简体   繁体   English

Javascript中的MSIE和addEventListener问题?

[英]MSIE and addEventListener Problem in Javascript?

document.getElementById('container').addEventListener('copy',beforecopy,false );

In Chrome / Safari, the above will run the "beforecopy" function when the content on the page is being copied. 在Chrome / Safari中,当复制页面上的内容时,上面将运行“beforecopy”功能。 MSIE is supposed to support this functionality as well, but for some reason I'm getting this error: MSIE也应该支持这个功能,但出于某种原因,我收到了这个错误:

"Object doesn't support this property or method" “对象不支持此属性或方法”

Now, it's my understanding that Internet Explorer won't play with the body node, but I would have thought providing a node by ID would work fine. 现在,我的理解是Internet Explorer不会使用body节点,但我认为通过ID提供节点可以正常工作。 Does anyone have any ideas about what I'm doing wrong? 有没有人对我做错了什么有任何想法? Thanks in advance. 提前致谢。

** Bonus points for anyone who can tell me what the 3rd parameter "False" is good for. **任何能告诉我第三个参数“False”有用的人的奖励积分。

In IE you have to use attachEvent rather than the standard addEventListener . 在IE中,您必须使用attachEvent而不是标准的addEventListener

A common practice is to check if the addEventListener method is available and use it, otherwise use attachEvent : 通常的做法是检查addEventListener方法是否可用并使用它,否则使用attachEvent

if (el.addEventListener){
  el.addEventListener('click', modifyText, false); 
} else if (el.attachEvent){
  el.attachEvent('onclick', modifyText);
}

You can make a function to do it: 你可以做一个功能:

function bindEvent(el, eventName, eventHandler) {
  if (el.addEventListener){
    el.addEventListener(eventName, eventHandler, false); 
  } else if (el.attachEvent){
    el.attachEvent('on'+eventName, eventHandler);
  }
}
// ...
bindEvent(document.getElementById('myElement'), 'click', function () {
  alert('element clicked');
});

You can run an example of the above code here . 您可以在此处运行上述代码的示例。

The third argument of addEventListener is useCapture ; addEventListener的第三个参数是useCapture ; if true, it indicates that the user wishes to initiate event capturing . 如果为true,则表示用户希望启动事件捕获

In case you are using JQuery 2.x then please add the following in the 如果您使用的是JQuery 2.x,请在中添加以下内容

<html>
   <head>
      <meta http-equiv="X-UA-Compatible" content="IE=edge;" />
   </head>
   <body>
    ...
   </body>
</html>

This worked for me. 这对我有用。

Internet Explorer (IE8 and lower) doesn't support addEventListener(...) . Internet Explorer(IE8及更低版本)不支持addEventListener(...) It has its own event model using the attachEvent method. 它使用attachEvent方法有自己的事件模型。 You could use some code like this: 你可以使用这样的代码:

var element = document.getElementById('container');
if (document.addEventListener){
    element .addEventListener('copy', beforeCopy, false); 
} else if (el.attachEvent){
    element .attachEvent('oncopy', beforeCopy);
}

Though I recommend avoiding writing your own event handling wrapper and instead use a JavaScript framework (such as jQuery , Dojo , MooTools , YUI , Prototype , etc) and avoid having to create the fix for this on your own. 虽然我建议避免编写自己的事件处理包装器,而是使用JavaScript框架(例如jQueryDojoMooToolsYUIPrototype等),并避免必须自己创建此修复程序。

By the way, the third argument in the W3C model of events has to do with the difference between bubbling and capturing events . 顺便说一句,W3C事件模型中的第三个参数与冒泡和捕获事件之间差异有关 In almost every situation you'll want to handle events as they bubble, not when they're captured. 几乎在每种情况下,你都会想要在泡沫时处理事件,而不是在它们被捕获时处理。 It is useful when using event delegation on things like "focus" events for text boxes, which don't bubble. 当对文本框的“焦点”事件使用事件委托时,它非常有用,它不会冒泡。

try adding 尝试添加

<meta http-equiv="X-UA-Compatible" content="IE=edge"> 

right after the opening head tag 在开头标签之后

As of IE11, you need to use addEventListener . 从IE11开始,您需要使用addEventListener attachEvent is deprecated and throws an error. 不推荐使用attachEvent并抛出错误。

Using <meta http-equiv="X-UA-Compatible" content="IE=9"> , IE9+ does support addEventListener by removing the "on" in the event name, like this: 使用<meta http-equiv="X-UA-Compatible" content="IE=9"> ,IE9 +通过删除事件名称中的“on”来支持addEventListener ,如下所示:

 var btn1 = document.getElementById('btn1');
 btn1.addEventListener('mousedown', function() {
   console.log('mousedown');
 });

The problem is that IE does not have the standard addEventListener method. 问题是IE没有标准的addEventListener方法。 IE uses its own attachEvent which does pretty much the same. IE使用自己的attachEvent ,它attachEvent

Good explanation of the differences, and also about the 3rd parameter can be found at quirksmode . 可以在quirksmode找到差异的良好解释,以及关于第3个参数。

正如PPK在这里指出的那样,在IE中你也可以使用

e.cancelBubble = true;

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM