jQuery append() into new window not working with M

Microsoft Edge is throwing 'No such interface supported' error when trying to append cloned content into new window. Here is an example:

jQuery(document).ready(function() {
    jQuery('.trigger').click(function() {
        var target = jQuery(this).data('print_target');

        var w = window.open('', '', 'status=no, toolbar=no, menubar=no, location=no');
        var print_html = '<!DOCTYPE html><head><title>' + document.getElementsByTagName('title')[0].innerHTML + '</title></head><body></body></html>';
        w.document.write( print_html );

        var ua = window.navigator.userAgent;
        var ie = true;

        //.html() required for IE browsers
        if ( ua.indexOf("MSIE ") != -1) {
            //console.log('MSIE - Craptastic');
            jQuery(w.document.body).append( jQuery( target ).clone( true ).html() );
        }
        else if ( ua.indexOf("Trident/") != -1) {
            //console.log('IE 11 - Trident');
            jQuery(w.document.body).append( jQuery( target ).clone( true ).html() );
        }
        else if ( ua.indexOf("Edge/") != -1 ){
            console.log('IE 12 - Edge');
            //error: No such interface supported
            jQuery(w.document.body).append( jQuery( target ).clone( true ).html() );

            //works
            //jQuery(w.document.body).append( 'hey dude, this is some text' );

            //works
            //jQuery(w.document.body).html( jQuery( target ).clone( true ).html() );

        }
        else{
            //console.log('proper browser');
            jQuery(w.document.body).append( jQuery( target ).clone( true ) );
            ie = false;
        }
    });
});

This is only an issue with Microsoft Edge, it works in all standards based browsers and IE browsers 7,8,9,10 and 11. A similar issue has been raised in this thread but not resolved.

here is a jsfiddle showing what's what: https://jsfiddle.net/switzerbaden/nhtywLsp/

After further investigation, I've found that jQuery will create a documentFragment when your HTML string yields multiple top-level sibling elements. The problem arrises when Microsoft Edge attempts to append the documentFragment to the second window.

For now, I would encourage you to pass HTML to the append method that yields only a single top-level element, with white-space trimmed from both sides. This way, we are guaranteed that jQuery will not attempt to append a documentFragment, but instead a single element.

A bug has been filed against Microsoft Edge, and the jQuery team has been notified.

I am an engineer on the Microsoft Edge team, and I see the issue you are referring to. I'm going to file a bug, and investigate this further, but for the time being, one work around is to have only a single child element in your target, and trim the content when appending:

<div id="my_target">
    <div>
        <!-- move contents in here -->
    </div>
</div>

$(w.document.body).append(
    // Or, "<div>" + $(target).html() + "</div>"
    $.trim( $(target).clone(true).html() )
);

After some cursory testing, this appears to resolve the issue.

jQuery append() into new window not working with M

问题:

回答1:

收藏的人(0)

jQuery append() into new window not working with M

问题:

回答1:

收藏的人(0)

举报内容

检举类型

检举原因

检举说明(必填)

打开微信“扫一扫”，打开网页后点击屏幕右上角分享按钮