Question

我正在尝试将canvas元素和标题元素一起打印到页面。我需要页面上的heading元素来定义canvas元素转换图像。这是我的代码：

<script>
    $(function print(){

        function print_content(){
            canvas = document.getElementById('exerciseChart');
            printHeading = document.getElementById('headingOne');
            var win=window.open();
            win.document.write("<br><img src='"+canvas.toDataURL()+"'/>");
            win.document.write("<br><img src='"+printHeading.toDataURL()+"'/>");
            win.print();
            win.location.reload();
        }

        $("#printContent").click(function(){ print_content(); });

    }); // end $(function(){});
</script>

我正在使用的代码（借用StackOverflow）单独打印canvas元素（exerciseChart）效果很好。当我尝试打印标题元素（headingOn e）和canvas元素时，没有任何反应。

这似乎是一个基本问题，但这是我一直在争论一段时间的问题。提前感谢任何建议！

Answer 1

您可以在新窗口中尝试innerHtml和html标签。试试这样的事情;

canvas = document.getElementById('exerciseChart');
printHeading = document.getElementById('headingOne');
var win=window.open('', '', 'height=500,width=900');
win.document.write('<html><head><title>Lets print</title>');            
win.document.write('<head/><body>');
win.document.write(canvas.innerHTML);
win.document.write(printHeading.innerHTML);
win.document.write('</body></html>');

如何将canvas元素和另一个元素打印到同一页面？

1 个答案: