js设置打印前后函数

来源：互联网发布：k-means java 编辑：程序博客网时间：2024/06/01 20:56
window.print() 实际上，是浏览器打印功能菜单的一种程序调用。与点击打印功能菜单一样，不能精确分页，不能设置纸型，套打的问题更加无从谈起，只不过，可以让用户不用去点菜单，直接点击网页中的一个按钮，或一个链接里面调用罢了。事实上，很多用户都是采用这种方式打印，但是这种方式最致命的缺点是不能设置打印参数，比如纸型，页边距，选择打印机等等。这种方法提供一个打印前和打印后的事件onbeforeprint、onafterprint。可以在打印前的时候重新编辑一些格式，专门送去打印，打印后又处理回来。function window.onbeforeprint() {    //将一些不需要打印的隐藏    //如：document.getElementById("div1").style.display="none";}function window.onafterprint() {    //放开隐藏的元??    //如：document.getElementById("div1").style.display="none";}通过这两个方法，就可以实现页面的局部打印window.print可以打印网页，但有时候我们只希望打印特定控件或内容，怎么办呢？=====================================================================================首先我们可以把要打印的内容放在div中，然后用下面的代码进行打印。<html><head><script language="javascript">function printdiv(printpage){var headstr = "<html><head><title></title></head><body>";var footstr = "</body>";var newstr = document.all.item(printpage).innerHTML;var oldstr = document.body.innerHTML;document.body.innerHTML = headstr+newstr+footstr;window.print(); document.body.innerHTML = oldstr;return false;}</script><title>div print</title></head><body>//HTML Page//Other content you wouldn't like to print<input name="b_print" type="button" class="ipt"   onClick="printdiv('div_print');" value=" Print "><div id="div_print"><h1 style="Color:Red">The Div content which you want to print</h1></div>//Other content you wouldn't like to print//Other content you wouldn't like to print</body></html>====================================================================================如图，我们要打印主页面中 工单详情部分。 但是由于要打印的部分有样式，并且表格太宽，如果 要直接打印的话，打出来的纸张上字太小且颜色模糊，不易查看。 只要去掉样式，字体会变大，打印出来的效果要好的多。 方案一：我们可以取出要打印的部分，将打印部分填充到弹出的新页面中，然后我就再打印弹出页面即可。 这样做的话，有个缺陷，就是会先把要打印的页面显示出来，然后要用户再次点击打印按键，显示比较啰嗦蛮烦。 方案二：可以在要打印的页面中，嵌入一隐藏的iframe，用于存放要打印的部分代码。 我们点击打印按钮时，实际上是打印这个隐藏iframe的内容。 打印页面代码 查看文本打印?<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"           "http://www.w3.org/TR/html4/loose.dtd">  <html>  <head>      <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />      <title>工单详细信息</title>      <script type="text/javascript">          function printPage() {              //获取当前页的html代码              var bodyhtml = window.document.body.innerHTML;              //设置打印开始区域、结束区域              var startFlag = "<!--startprint-->";              var endFlag = "<!--endprint-->";              // 要打印的部分              var printhtml = bodyhtml.substring(bodyhtml.indexOf(startFlag),                       bodyhtml.indexOf(endFlag));              // 生成并打印ifrme              var syfPrint = document.frames[0];              syfPrint.document.body.innerHTML = printhtml;              syfPrint.document.execCommand("Print");          }      </script>  </head>  <body>      <div id="bd">          <div id="right_box">              <a href="#" onclick="javascript:history.back(1); event.returnValue=false">                      << 返回</a><br />              <!--startprint-->                  //////////////////////要打印的内容部分//////////////////////<br />              <!--endprint-->              <input type="button" value="打印" onClick="printPage()" />      </div>      <iframe src="" width="0" height="0" frameborder="0"></iframe>  </body>  </html>
0 0