首页 > 代码库 > 打印html5中Canvas的方法

打印html5中Canvas的方法

2024-09-16 16:30:07   216人阅读

function print_voucher(){ // 打印的主要方法
    var win=window.open();
    win.document.write("<br><img src=http://www.mamicode.com/‘"+canvas.toDataURL()+"‘/>");
    win.print();
    win.location.reload();
}

需要打开一个窗口进行打印，示例代码如下：

<script>
$(function(){

    var canvas=document.getElementById("canvas");
    var ctx=canvas.getContext("2d");

    ctx.fillStyle="gold";
    ctx.strokeStyle="blue";
    ctx.lineWidth=5;
    ctx.rect(50,50,100,100);
    ctx.fill();
    ctx.stroke();

    function print_voucher(){
        var win=window.open();
        win.document.write("<br><img src=http://www.mamicode.com/‘"+canvas.toDataURL()+"‘/>");
        win.print();
        win.location.reload();
    }

    $("#printVoucher").click(function(){ print_voucher(); });


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

<body>
    <canvas id="canvas" width=300 height=300></canvas><br>
    <button id="printVoucher">Print</button>
</body>

 

打印html5中Canvas的方法


联系
我们