云迈博客

您现在的位置是:首页 > 前端技术 > 原生js相关 > 正文

原生js相关

js 打印

Yjj2021-07-26原生js相关353
博客园已更新:https://www.cnblogs.com/Yjjhn/p/15062825.htmlcss@mediaprint{.noprint{displ

博客园已更新:https://www.cnblogs.com/Yjjhn/p/15062825.html

css
<style type="text/css">
@media print {
.noprint{
display: none;
}
}
</style>

html

<!--startprint1-->

<h1 style="text-align: center;">这里是打印1的内容</h1>
<p style="text-indent: 2em;">这里是内容内容内容</p>
<div class="noprint">打印不可见</div>

<!--endprint1-->

<!--startprint2-->

<h1 style="color:red;">这里是打印2的内容</h1>
<div class="noprint">打印不可见</div>

<!--endprint2-->

<!--startprint11-->

<h1 style="color:blue;">这里是打印11的内容</h1>
<div class="noprint">打印不可见</div>

<!--endprint11-->

<input type='button' name='button_export' title='打印1' onclick=preview(1) value='打印1'>
<input type='button' name='button_export' title='打印2' onclick=preview(2) value='打印2'>
<input type='button' name='button_export' title='打印11' onclick=preview(11) value='打印11'>

js

<script language="javascript">
function preview(fang){
if (fang < 5){
bdhtml=window.document.body.innerHTML;//获取当前页的html代码
sprnstr="<!--startprint"+fang+"-->";//设置打印开始区域
eprnstr="<!--endprint"+fang+"-->";//设置打印结束区域
prnhtml=bdhtml.substring(bdhtml.indexOf(sprnstr)+18); //从开始代码向后取html
prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));//从结束代码向前取html
window.document.body.innerHTML=prnhtml;
window.print();
window.document.body.innerHTML=bdhtml;
} else {
window.print();//方法用于打印当前窗口的内容。
}
}
</script>

发表评论

评论列表

  • 这篇文章还没有收到评论,赶紧来抢沙发吧~