Heim > Artikel > Web-Frontend > Beispielcode für die JS-Aufrufdruckerfunktion
Beispielcode für die JS-Aufrufdruckerfunktion
- 怪我咯Original
- 2017-07-13 15:22:112441Durchsuche
Manchmal ist es notwendig, Front-End-Projekten eine Druckfunktion hinzuzufügen. Zunächst müssen Sie wissen, dass das Drucken in zwei Arten unterteilt wird: Das teilweise Drucken kann in das teilweise Drucken bestimmter Teile unterteilt werden. und teilweises Drucken anderer als der angegebenen Teile. Beispiele sehen klarer aus als Text.
Die Beispiele in diesem Artikel beschreiben, wie JS die Druckerfunktion aufruft. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><!--{$aListData.name}-->准考证</title>
<input id="btnPrint" type="button" value="打印" onclick="javascript:window.print();" />
<input id="btnPrint" type="button" value="打印预览" onclick=preview(1) />
<style type="text/css" media=print>
.noprint{display : none }
</style>
<script>
function preview(oper)
{
if (oper < 10)
{
bdhtml=window.document.body.innerHTML;//获取当前页的html代码
sprnstr="<!--startprint"+oper+"-->";//设置打印开始区域
eprnstr="<!--endprint"+oper+"-->";//设置打印结束区域
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>
<script type="text/javascript" src="/js/jquery-1.4.2.min.js"></script>
<script>
jQuery(function($){
$("#closeButton").click(function(){
window.close();
})
});
</script>
</head>
<body>
<a id='closeButton' title='Close' href="#" >关闭</a>
<!-- 打印startprint与endprint之间的内容-->
<!--startprint1-->
<h1>高级中学2013年预科招生考试</h1>
姓名：<!--{$aListData.name}--><br/>
性别：<!--{$aListData.gender}--><br/>
毕业学校：<!--{$aListData.grschool}--><br/>
编号：<input type="text" name="sturegcard" class="input1 ml10" value="<!--{$aListData.sturegcard}-->"/><br/>
头像：<img src="<!--{$aListData.avatar}-->" width="140"><br/>
考试日程：<br/>
地点：<br/>
<!--{if $aRegExamsche}-->
<!--{section name=data loop=$aRegExamsche}-->
<!--{$aRegExamsche[data].date}-->
<!--{$aRegExamsche[data].time}-->
<!--{$aRegExamsche[data].lesson}-->
<!--{$aRegExamsche[data].place}--><br/>
<!--{/section}-->
<!--{/if}-->
<!--endprint1-->
</body>
</html>Das obige ist der detaillierte Inhalt vonBeispielcode für die JS-Aufrufdruckerfunktion. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!