cari

Rumah  >  Artikel  >  hujung hadapan web  >  JS调用打印机功能示例代码

JS调用打印机功能示例代码

怪我咯
怪我咯asal
2017-07-13 15:22:112511semak imbas

有时前端的项目中需要添加打印的功能，首先要知道打印分为整体打印和局部打印两种，而局部打印又可细分为局部打印指定的部分，和局部打印指定部分之外的部分。实例比文字看起来更清晰，

本文实例讲述了JS调用打印机功能的方法。分享给大家供大家参考，具体如下：

<!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=&#39;closeButton&#39; title=&#39;Close&#39; 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>

Atas ialah kandungan terperinci JS调用打印机功能示例代码. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：Web制作验证码的功能实例代码Artikel seterusnya：jQuery实现下拉菜单的功能实例代码

Artikel berkaitan

Lihat lagi