<script type="text/javascript" src="/UploadFiles/2021-04-02/jquery-migrate-1.2.1.min.js">

注意：这里是先引入的jQuery文件，如果没有引入第一个js文件的话，会出现兼容性问题，导致使用jqprint打印时报错。
html页面
这里面的html标签很多的




<div class="wrap-content container" id="container">
 <table border="0" cellpadding="0" cellspacing="0" class="store-joinin baseinfo">
  <thead>
   <tr>
    <th colspan="40">用户信息</th>
   </tr>
  </thead>
  <tbody>
   <tr style="background: rgb(255, 255, 255);">
    <th>姓名：</th>
    <td colspan="40">18030632605</td>
   </tr>
   <tr style="background: rgb(255, 255, 255);">
    <th>性别：</th>
    <td colspan="40">男</td>
   </tr>
   <tr style="background: rgb(255, 255, 255);">
    <th>年龄：</th>
    <td colspan="40">41</td>
   </tr>
   <tr style="background: rgb(255, 255, 255);">
    <th>身份证：</th>
    <td colspan="40">52272419770101059X</td>
   </tr>
   <tr style="background: rgb(255, 255, 255);">
    <th>所属机构：</th>
    <td colspan="40">上海市政法委</td>
   </tr>
  </tbody>
  </table>
 ......
 <button class="btn btn-danger printBtn1" onclick="btnPrintClick()" type="button">打 印</button>


当然下面还有很多的html标签，在这里就不展示了。
打印按钮点击之后执行的函数


function btnPrintClick(){
 var imgBox = $('#img_box');
 var chartBox = $('#main');
 if (imgBox.length <= 0) {
  chartBox.after('<div id="img_box"></div>');
  imgBox = $('#img_box');
 }
 // 将echart生成图片并放入img-box，并显示图片img-box
 imgBox.html('< img src="/UploadFiles/2021-04-02/' + myChart.getDataURL() + '">

注意事项：
这里使用了图片的缩放比例的方式。比如Echarts图表要显示的内容特别多的话，一般在html页面中采用的是在X轴上使用滚动条的方式，但是打印时可以将Echarts图表先转换成图片，并等比例进行缩放，打印完毕之后再还原回来即可。
任何不需要打印的标签都可以先隐藏。对于不需要出现在打印页面的标签内容，我们在打印之前使用jQuery查找到对应的元素，将该元素隐藏起来，打印结束之后，再将隐藏的元素显示出来即可。
属性

  
debug: false, //如果是true则可以显示iframe查看效果（iframe默认高和宽都很小，可以再源码中调大），默认是false
  
importCSS: true, //true表示引进原来的页面的css，默认是true。（如果是true，先会找$("link[media=print]")，若没有会去找$("link")中的css文件）
  
printContainer: true, //表示如果原来选择的对象必须被纳入打印（注意：设置为false可能会打破你的CSS规则）。
  
operaSupport: false //表示如果插件也必须支持歌opera浏览器，在这种情况下，它提供了建立一个临时的打印选项卡。默认是true

  

总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，如果有疑问大家可以留言交流，谢谢大家对的支持。