js 打印

時間 2019-12-09

原文原文鏈接

  一、藉助插件打印（ps:該插件也是經過iframe進行打印） 

 
  <!DOCTYPE html>
<html>

 <head>
  <meta charset="UTF-8">
  <title>print page demo 3</title>
  <script type="text/javascript" src="../jquery/jquery-1.11.2.min.js"></script>
  <script type="text/javascript" src="jquery.PrintArea.js"></script>
 </head>

 <body>
  <script>
   $(document).ready(function() {
    $("input#biuuu_button").click(function() {

     $("div#myPrintArea").printArea();

    });
   });
  </script>

  <input id="biuuu_button" type="button" value="打印"></input>
肯定是打印局部？？？
  <div id="myPrintArea">.....文本打印部分.....</div>
 </body>

</html>
 
 
 

   二、window.open打開新頁面進行打印 
 
 
   <!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title>print page demo</title>
  <script type="text/javascript" src="../jquery/jquery-1.11.2.min.js" ></script>
  <script type="text/javascript">
   function printPage() {
    var newWindow = window.open("", "_blank"); //打印窗口要換成頁面的url
    //繪製html
    newWindow.document.write($("#printArea").html());
    //打印後關閉窗口
    newWindow.document.close();
    newWindow.print();
    newWindow.close();
   }
  </script>
 </head>
 <body>
  <div><button type="button" onclick="printPage()">打印</button></div>
  <div id="printArea">
   <div class="print_title">標題</div>
   <div class="print_content">打印的內容</div>
  </div>
 </body>
</html>
 
  
 

    三、iframe進行打印 
  
 
   function do_print(id_str) //id-str 打印區域的id
   {
    var el = document.getElementById(id_str);
    var iframe = document.createElement('IFRAME');
    var doc = null;
    iframe.setAttribute('style', 'position:absolute;width:0px;height:0px;left:-500px;top:-500px;');
    document.body.appendChild(iframe);
    doc = iframe.contentWindow.document;
    // 引入打印的專有CSS樣式，www.111Cn.net根據實際修改
    doc.write("<LINK rel="
     stylesheet " type="
     text / css " href="
     css / print.css ">");
    doc.write('<div>' + el.innerHTML + '</div>');
    doc.close();
    iframe.contentWindow.focus();
    iframe.contentWindow.print();
    if(navigator.userAgent.indexOf("MSIE") > 0) {
     document.body.removeChild(iframe);
    }
   }
//	var iframe = document.getElementById('printPage');
    // 異步加載，致使內容還沒獲取就打印了
//	iframe.onload = function() {
//	iframe.contentWindow.focus(); 
//	iframe.contentWindow.print(); 
//	}
 
  

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。