javascript addEventListener 在 IE 11 中不起作用

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/47589796/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-29 07:29:29  来源:igfitidea点击:

addEventListener does not work in IE 11

javascriptinternet-explorerpopup

提问by Andreas

I am using javascript to open a popup and execute some code once it is loaded.

我正在使用 javascript 打开一个弹出窗口并在加载后执行一些代码。

This is the code:

这是代码:

// ?ffnen des Print Popups binden.
$('#revi_print').unbind();
$('#revi_print').click(function() {

    // Popup erstellen.
    popup = window.open('report_handle/print.php?filter_report=' + $('#revi').data('filter_report'), "Popup", "width=1024, height=768, scrollbars=yes, toolbar=no, status=no, resizable=yes, menubar=no, location=no, directories=no, top=10, left=10");

    // Code erst ausführen, wenn das Popup geladen ist.
    popup.addEventListener('load', handle_popup, false);
});

It does work fine in Firefox and Google Chrome, however I have realized, that it does not work in the newest Internet Explorer.

它在 Firefox 和 Google Chrome 中运行良好,但是我意识到它在最新的 Internet Explorer 中不起作用。

From what I have read, addEventListener should be supported above IE9, so theoretically IE 11 should support it - however it seems this is not the case.

从我读到的内容来看,应该在 IE9 以上支持 addEventListener,所以理论上 IE 11 应该支持它 - 但似乎情况并非如此。



This error indicates, that IE11 is not supporting the method...

此错误表明 IE11 不支持该方法...

enter image description here

在此处输入图片说明



Is there a simple workaround to make this work?

是否有一个简单的解决方法来完成这项工作?



I have just tried this pice of code:

我刚刚试过这段代码:

if (popup.addEventListener){
    alert("firefox, chorome, etc");
    popup.addEventListener('load', handle_popup, false); 
} else if (popup.attachEvent){
    alert("IE");
    popup.attachEvent('load', handle_popup);
}   

Apparently this should work according to different other threads, but it is not the case. The browser does go to the else if, when IE is used - however it still refuses to work.

显然这应该根据不同的其他线程工作,但事实并非如此。当使用 IE 时,浏览器确实会转到 else if - 但是它仍然拒绝工作。

Could it be, that attachEvent in IE does not work on popups?

会不会,IE 中的 attachEvent 对弹出窗口不起作用?

enter image description here

在此处输入图片说明



I have just tried the method indicated in the first answer.

我刚刚尝试了第一个答案中指出的方法。

It works in firefox and chrome, but IE refuses to work, even tough this method does not have the EventListener any more:

它适用于 firefox 和 chrome,但 IE 拒绝工作,即使这种方法不再有 EventListener:

// ?ffnen des Print Popups binden.
$('#revi_print').unbind();
$('#revi_print').click(function() {

    // Popup erstellen.
    popup = window.open('report_handle/print.php?filter_report=' + $('#revi').data('filter_report'), "Popup", "width=1024, height=768, scrollbars=yes, toolbar=no, status=no, resizable=yes, menubar=no, location=no, directories=no, top=10, left=10");

    // Code erst ausführen, wenn das Popup geladen ist.
    //popup.addEventListener('load', handle_popup, true);

    popup.window.onload=function() { parent.handle_popup(popup); }
});

// Code zum handeln des Popups.
function handle_popup(popup) {
    var selected_report = $('#revi').data('filter_report');
    var jqplot_object = $('#revi_filter_ddReport_' + selected_report + '_jqplot_object').html();
    var has_chart = $('#revi_filter_ddReport_' + selected_report + '_has_chart').html();
    var obj = $.parseJSON($('#revi').data('data').trim());

    // Den Kontent kopieren.
    popup.$('#revi_sec_report_container').html($('#revi_report_container').html());

    // Den Print Button entfernen.
    popup.$('#revi_print').remove();

    // Das chart entfernen.
    popup.$('#revi_chart').empty();

    // Wenn ein Chart gezeichnet werden soll.
    if (has_chart == 1) { 
        var execute_string = $.base64.decode(jqplot_object);
        eval(execute_string); 
    }
}


Next attempt (half successful):

下一次尝试(成功一半):

I have added this line of code to the HTML of the POPUP:

我已将这行代码添加到 POPUP 的 HTML 中:

enter image description here

在此处输入图片说明

This are the changes on the javascript side:

这是 javascript 方面的变化:

// ?ffnen des Print Popups binden.
$('#revi_print').unbind();
$('#revi_print').click(function() {

    // Popup erstellen.
    popup = window.open('report_handle/print.php?filter_report=' + $('#revi').data('filter_report'), "Popup", "width=1024, height=768, scrollbars=yes, toolbar=no, status=no, resizable=yes, menubar=no, location=no, directories=no, top=10, left=10");

    $('body').data('the_popup', popup);

    // Code erst ausführen, wenn das Popup geladen ist.
    //popup.addEventListener('load', handle_popup, true);

    //window.onload=function() { handle_popup(popup); }
});

// Code zum handeln des Popups.
function handle_popup() {

    var popup = $('body').data('the_popup');

    var selected_report = $('#revi').data('filter_report');
    var jqplot_object = $('#revi_filter_ddReport_' + selected_report + '_jqplot_object').html();
    var has_chart = $('#revi_filter_ddReport_' + selected_report + '_has_chart').html();
    var obj = $.parseJSON($('#revi').data('data').trim());

    // Den Kontent kopieren.
    popup.$('#revi_sec_report_container').html($('#revi_report_container').html());

    // Den Print Button entfernen.
    popup.$('#revi_print').remove();

    // Das chart entfernen.
    popup.$('#revi_chart').empty();

    // Wenn ein Chart gezeichnet werden soll.
    if (has_chart == 1) { 
        var execute_string = $.base64.decode(jqplot_object);
        eval(execute_string); 
    }
}

On firefox and Chrome it works perfectly, the popup opens, and the chart that should be drawn on the popup shows up.

在 firefox 和 Chrome 上它完美运行,弹出窗口打开,应该在弹出窗口上绘制的图表显示出来。

Now IE also executes the code for the popup, which is very good, but now only for IE JQPLOT does throw an error somewhere in the library.

现在IE也执行popup的代码,非常好,但是现在只针对IE JQPLOT确实会在库的某处抛出错误。

I have no clue why this happens, I can only guess that the popup is not jet finished loading, when the code for jqplot is executed.

我不知道为什么会发生这种情况,我只能猜测当 jqplot 的代码被执行时,弹出窗口没有完成加载。



Got everything working now - the jqplot thing is fixed now...

现在一切正常 - jqplot 的事情现在已经修复了......

回答by mplungjan

Sounds like a dupe of Detecting the onload event of a window opened with window.open

听起来像是检测用 window.open 打开的窗口的 onload 事件的骗局

but I could not see a specific answer of your question in it.

但我看不到你的问题的具体答案。

But why not do

但为什么不做

window.onload=function() { opener.handle_popup() } // or attachEventListener

in the child window? Not need for attach events that may never be triggered because your attaching may be after the load triggered

在子窗口?不需要可能永远不会触发的附加事件,因为您的附加可能是在负载触发之后

TRY IT

试试看

Tested and working (after allowing popups) in Chrome Edge, IE11 and FX

在 Chrome Edge、IE11 和 FX 中测试和工作(允许弹出窗口后)

回答by NVCoder

As explained in "https://github.com/angular/zone.js/issues/535", another reason sometimes is that IE takes time to return the window object returned by window.open. As a result by the time your addEventlistenercode executes, the object doesn't have this function. The workaround I used was:

正如“ https://github.com/angular/zone.js/issues/535”中所述,另一个原因有时是 IE 需要时间来返回window.open. 因此,在您的addEventlistener代码执行时,该对象没有此功能。我使用的解决方法是:

popup = window.open('report_handle/print.php?filter_report=' + $('#revi').data('filter_report'), "Popup", "width=1024, height=768, scrollbars=yes, toolbar=no, status=no, resizable=yes, menubar=no, location=no, directories=no, top=10, left=10");
var interval = setInterval(function(){
   if(typeof popup.addEventListener === "function"){
   clearInterval(interval);
    popup.addEventListener('load', handle_popup, false);
   }
},100);