h5打印时如何控制打印区域（基于jquery.PrintArea.js实现） |
您所在的位置：网站首页 › js设置打印参数格式在哪找出来 › h5打印时如何控制打印区域（基于jquery.PrintArea.js实现） |
h5打印时如何控制打印区域（基于jquery.PrintArea.js实现）
|
h5打印时如何控制打印区域（基于jquery.PrintArea.js实现）
javaSript 的 window.print() 打印时打印范围不可控制，而jquery.PrintArea.js可以实现打印范围的控制。
1.下载jquery.PrintArea.js jquery.PrintArea.js下载地址：点击下载 2.引入jq ，引入jquery.PrintArea.js（注意顺序问题） 3.link引入css样式 (css样式不要写在style中,不然打印预览的时候样式不生效，具体啥原因还未研究，link标签引入样式样式才会生效。) 4.html部分： //要打印的区域5.js $("#printBtn").click(function(){ $(".printShow").printArea(); });后期补充： 最近遇到好多打印页面，打印样式上调了好久，好多属性都是网上查找的，没记住，在此算是做个简单的笔记吧！ 如果不想用上面介绍的jq的那个插件，那直接简单粗暴的用css控制打印的样式吧： @media print { //这里是打印的样式，将不需要打印出来的盒子直接用display:none;隐藏就好了。 }或者用link引入，后面加 media="print"属性打印样式就用这里面的css控制了。 最近打印碰到的的问题： table表格打印，一页没放下，内容要到第二页去，不作处理会出现这种情况。
解决办法： @media print { td,tr{ page-break-inside: avoid;} //用于设置是否在指定元素中插入分页，avoid 避免在元素内部插入分页符。 } 想让特定的某个div在新的一页 打印 我是封面 我是目录，你不知道我的内容有多长 我是正文，我需要从一个新页面开始展示 function printFun() { window.print(); }这样，封面，目录和正文分别在打印预览的下一页了。 page-break-after:always; //设置在表格元素之后始终进行分页的分页行为： page-break-after:avoid; //避免在元素后插入分页符 page-break-before 和page-break-after一样的用法， 元素在指定元素前添加分页符。 菜鸟一枚，现学现记录吧。。。关于打印，看到过一篇不打错的博客，推荐给大家，有兴趣的可以看看 https://www.cnblogs.com/zoucaitou/p/4232388.html |
【本文地址】
公司简介
联系我们
今日新闻 |
点击排行 |
|
推荐新闻 |
图片新闻 |
|
专题文章 |