【Jquery】------- 實現JavaScript調用打印點擊關閉打印調用關閉之後函數示例代碼

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 ----------------------------------------

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章