我有一個(gè)這樣的需要打印表格，但是表格數(shù)據(jù)因數(shù)據(jù)太多數(shù)據(jù)顯示不全，該功能是我很頭疼，按需求是找到一個(gè)給指定區(qū)域打印表格的數(shù)據(jù)區(qū)域，因此引用了一個(gè)叫jquery.pint.js的一個(gè)打印插件，并做此記錄。希望能幫到你?( ?? ·? ? ?)

一、引用jquery.pint.js插件
首先下載jquery.print.js
http://www.jq22.com/demo/jQueryPrint201709042243/jQuery.print.js

<script src="js/jquery-3.3.1.js"></script>
<script src="js/jQuery.print.js"></script>

二、代碼塊
寫(xiě)一個(gè)按鈕加入點(diǎn)擊事件，再給你要打印的區(qū)域加一個(gè)id

<div>
    <button class="print-link no-print" onclick="printele()">打印</button>

    <div id="ele2">
      <div>
        <div style="width: 100px;height:300px;background: paleturquoise;">
           <table width="100%" cellpadding="10" align="center" cellspacing="2" border="1" bordercolor="#ccc" style="height: 400px;">
              ......
           </table>
        </div>
      </div>
   </div>
</div>

三、事件塊

<script type='text/javascript'>
    //觸發(fā)printele點(diǎn)擊事件
    function printele() {
      $.print("#ele2");
    }
</script>

四、查看效果

沒(méi)點(diǎn)擊打印前.png

點(diǎn)擊打印后.png