使用jquery打印插件打印div并不起作用

时间:2017-05-05 03:05:30

标签: javascript jquery printing jquery-plugins

我想在我的代码中使用此http://projects.erikzaadi.com/jQueryPlugins/jQuery.printElement/插件打印一个ID为tbody的{​​{1}}来解决打印时无法关闭/关闭模式的问题。

这是我的代码。

alltransactsdaily

现在我想使用此javascript打印<div class="col-md-9"> <input type="hidden" name="clinic_idhid" id="clinic_idhid"> <div class="table_transactions" id="table_transactions"> <table id="mytransactions" class="table table-striped table-bordered table-hover dataTable dtr-inline" role="grid" style="width: 100%;" width="100%" aria-describedby="dataTables-material"> <thead> <th>Check-up ID</th> <th>First Name</th> <th>Last Name</th> <th>Check-up Date & Time</th> <th>Bill Amount</th> <tbody id="alltransactsdaily"> </tbody> </table> </div> </div> <button type="button" id="btn_printdiv" class="btn btn-primary"><span class="fa fa-print"></span> Print</button>

tbody id="alltransactsdaily"

当我点击按钮时控制台显示:

$("#btn_printdiv").click(function () {
    $("#alltransactsdaily").printElement();
});

1 个答案:

答案 0 :(得分:1)

尝试这个它不会打开模态它将在模态弹出窗口内打开同一页面上的打印

https://jsfiddle.net/athulnair/dqtcb3v8/1/

<div id="print-area-1" class="print-area">
    <div style="text-align:right;"><a class="no-print" href="javascript:printDiv('print-area-1');">Print</a></div>
    <h2>Lorem Ipsum</h2>
    <p>gh.</p>
</div>

function printDiv(elementId) {
    var a = document.getElementById('printing-css').value;
    var b = document.getElementById(elementId).innerHTML;
    window.frames["print_frame"].document.title = document.title;
    window.frames["print_frame"].document.body.innerHTML = '<style>' + a + '</style>' + b;
    window.frames["print_frame"].window.focus();
    window.frames["print_frame"].window.print();
}