zoukankan      html  css  js  c++  java

  • windows页面打印div(弹出新页面)

      1. <!DOCTYPE html>  
      2. <html>  
      3. <head>  
      4. <meta charset="utf-8">  
      5. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">  
      6. <title>打印测完</title>  
      7. <meta name="description" content="">  
      8. <meta name="keywords" content="">  
      9. <link href="" rel="stylesheet">  
      10. <style>  
      11.     #oDiv2 div{ 100px;height: 100px;border:1px solid #c50000;}  
      12. </style>  
      13. </head>  
      14. <body>  
      15.     <div>aaa</div>  
      16.     <div id='oDiv2'><div>bbb</div></div>  
      17.     <div>ccc</div>  
      18.     <input type="button" value="打印" id="js_print" />  
      19.   
      20.     <script>  
      21.   
      22.     var oPrintBtn = document.getElementById("js_print");  
      23.     var oDiv2 = document.getElementById("oDiv2");  
      24.     oPrintBtn.onclick=function(){  
      25.         var oPop = window.open('','oPop');  
      26.         var str = '<!DOCTYPE html>'  
      27.             str +='<html>'  
      28.             str +='<head>'  
      29.             str +='<meta charset="utf-8">'  
      30.             str +='<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">'  
      31.             str+='<style>';  
      32.             str+='#oDiv2 div{ 100px;height: 100px;border:1px solid #c50000;}';  
      33.             str+='</style>';  
      34.             str +='</head>'  
      35.             str +='<body>'  
      36.             str +="<div id='oDiv2'><div>bbb</div></div>";  
      37.             str +='</body>'  
      38.             str +='</html>'  
      39.   
      40.         oPop.document.write(str);  
      41.         oPop.print();  
      42.         oPop.close();  
      43.     }  
      44.   
      45.     </script>  
      46. </body>  
      47. </html>  
      48. 对于不想显示的在打印前隐藏，打印后显示即可
  • 相关阅读:
    微信H5跳转到小程序
    对比React的hooks与Vue的composition
    H5网页在ios，android，微信中打开手机中的地图导航
    MySQL学习笔记（一）
    Matlab学习笔记（五）
    Matlab学习笔记（四）
    Matlab学习笔记（三）
    Matlab学习笔记（二）
    Matlab学习笔记（一）
    Python学习笔记（四）
  • 原文地址：https://www.cnblogs.com/sdaulldd/p/4624030.html
Copyright © 2011-2022 走看看