Question

我无法使用jQuery点击打印按钮打印谷歌地图。我使用的是Google Maps API的第3版。地图在页面上正确呈现，但是当我单击打印按钮时，它不会打印地图的任何内容。这是代码：

printLinks.init = function () {

$('body').on('click', '.js-print-link', function (e) {

var prWin = window.open('', '_blank', 'resizable=yes,scrollbars=yes,status,width=600,height=700');
prWin.document.write('<HTML><HEAD><LINK href=/css/print.css ' + ' type="text/css" rel="stylesheet"><title>Print Window</title>');
prWin.document.write('<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js""></script>');
prWin.document.write('<script type="text/javascript" src="//maps.googleapis.com/maps/api/js?v=3&sensor=false&callback=initializeMaps"></script>');
var prCon = document.getElementById('body').innerHTML;
var str1 = $.parseHTML(prCon);
$('<div/>').append(htmlstring).find('#abc').append('<a id="prClick" href="#" class="share-print" onClick="window.print()" style="float:right"></a>');
var str2 = $('<div/>').append(str1);
prWin.document.write(str2.html());
prWin.document.close();
prWin.focus();
e.preventDefault();
});
};

为了更多地解释上面的代码，点击页面底部的按钮，一个名为＆＃34; Print Window＆＃34;打开600 * 700的大小，包含原始窗口的内容，但有不同的名为print.css的css，这里提到的。原始窗口也包含谷歌地图。在新的＆＃34;打印窗口＆＃34;此外，地图显示正确，但当我点击＆＃34;打印窗口＆＃34;右上角的打印图标时，根本不打印地图。请建议。

Answer 1

var printMaps = function () {
        var body               = $('body'),
            mapContainer       = $('#YourMapContainer'),
            mapContainerParent = mapContainer.parent(),

            printContainer     = $('<div>');

        body.prepend(printContainer);
        printContainer
            .addClass('print-container')
            .css('position', 'relative')
            .height(mapContainer.height())
            .append(mapContainer);

        var content = body.children()
            .not('script')
            .not(printContainer)
            .detach();

        window.print();

        body.prepend(content);
        mapContainerParent.prepend(mapContainer);
        printContainer.remove();
    };

    $('#PrintButton').on('click', printMaps);

单击打印按钮无法打印Google地图

1 个答案: