【Jquery】------- 实现JavaScript调用打印点击关闭打印调用关闭之后函数示例代码

小灰灰 2023-06-11 10:22 6阅读 0赞

> 1. 实现JavaScript调用打印点击关闭打印调用关闭之后函数示例代码
> 
>   (HTML)
> 
>     <div  style="position: absolute; right: 20px;top:10px;z-index:333;">
>       <button id="btn-print" style="border:0px;background-color: #107ceae0;padding: 8px 20px;    border: 0px; border-radius: 5px;color: #fff;">打印</button>
>     </div>
> 
>

> (JavaScript) 
> 
>     // 打印代码---------------------------
>         //启用打印
>        window.handlePrint=function() {
>             var printHtml = document.getElementById('map').innerHTML;
>             var oldstr = document.body.innerHTML;
>             window.document.body.innerHTML = printHtml;
>             window.print();
>             document.body.innerHTML = oldstr;
>     
>             return true;
>     
>         }
>         //打印之前调用
>         var beforePrint = function() {
>             console.log('Functionality to run before printing.');
>         };
>         //打印之后调用
>         var afterPrint = function() {
>             console.log('Functionality to run after printing');
>             window.printClick();
>         };
>         //监听
>         if (window.matchMedia) {
>             var mediaQueryList = window.matchMedia('print');
>             mediaQueryList.addListener(function(mql) {
>                 if (mql.matches) {
>                     beforePrint();
>                 } else {
>                     afterPrint();
>                 }
>             });
>         }
>     
>         window.onbeforeprint = beforePrint;
>         window.onafterprint = afterPrint;
>     	//打印
>     	window.printClick=function(){
>             $("#btn-print").on("click",function () {
>                 window.handlePrint();
>             });
>     	}
>         window.printClick();
>     
>         //end ----------------------------------------
> 
>