Muh*_*ris 5 html javascript ajax jquery twitter-bootstrap
我想打印一个引导 div。
它在网络浏览器中正确显示,但是当我点击打印按钮然后在打印预览时,元素是浮动的并且没有正确显示。
我该怎么做才能解决这个问题?
调用打印函数的按钮:
<button class="btn btn-default" onclick="printDiv('printableArea')"><i class="fa fa-print" aria-hidden="true" style=" font-size: 17px;"> Print</i></button>
Run Code Online (Sandbox Code Playgroud)
打印功能:
function printDiv(divName) {
var printContents = document.getElementById(divName).innerHTML;
var originalContents = document.body.innerHTML;
document.body.innerHTML = printContents;
window.print();
document.body.innerHTML = originalContents;
}
Run Code Online (Sandbox Code Playgroud)
我想打印的 Div
<div class="container right-container col-md-6" id="printableArea" style="display:block;">
<span id="link7">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<h3 id="school_title"><?php echo "$school_name";?> </h3>
<p><p>
<p style="font-size: 1.1em;" id="exam_title">Annual Examination [ 2015-2016 ] <p>
<div class="row">
<div class="col-md-4">
<div class="header-time-date-marks">
<span id="exam_time">Time: 12 AM - 2 PM</span>
<span id="exam_date">Date: 30/12/2016</span>
</div>
</div>
<div class="col-md-8 header-time-date-marks" style="text-align: right;padding-right: 36px;">
<span id="exam_marks">100 Marks</span>
</div>
</div>
</div>
</div>
<hr / id="line" style="margin-top: 13px;">
<div class="row q-question-type-style" id='question_section'>
</div>
</span>
</div>
Run Code Online (Sandbox Code Playgroud)
小智 5
检查此解决方案:它正在工作。在<div>能够显示打印。
将<script>-tag放在-tag 上方<html>:
<script>
<html>
Run Code Online (Sandbox Code Playgroud)
https://jsfiddle.net/6cz5br7m/
| 归档时间: |
|
| 查看次数: |
18942 次 |
| 最近记录: |