jquery jqprint 打印 每页控制打印内容,每一页都带有表头,怎么搞啊_百 ...
发布网友
发布时间：2022-04-24 06:03
共3个回答
热心网友
时间：2022-04-19 09:20
解决步骤如下。
打印预览；在需要打印的表格先点击打印预览，看下自己需要打印的内容是否都完整的在一页一页上面。
选择页面布局；预览之后都完整，开始进行打印标题操作。选择页面布局之后点击里面打印标题。
打印区域选择；点击打印标题后会出现一个页面设置框，选择里面工作表，点击打印顶端标题。这里要注意下是顶端标题不要选择错了。
顶端标题选择；点击打印顶端标题箭头后出现一条小框，在你刚才需要打印excel表格里面选择第一行标题，在小框里面就会出现$1:$1，意思就是选择了要打印的顶端标题区域。
确认标题；选择好打印区域后，点击小框旁边键就返回到页面设置框，就看到顶端标题已经有了，点击确定。
预览完成；确认好后再次预览，翻到后面几页看下就已经有顶端标题了。如果要打印前面两行标题，就在选择区域的时候选择前面2行就可以了！最后再完成打印就可以了。
热心网友
时间：2022-04-19 10:38
我们可以通过写代码完成上述的效果，然后单击网页上的某个按钮，在按钮的处理方法里调用jqprint()，来完成这个区域的的打印显示的操作，首先要获取这个区域，然后调用一个方法即可了，如下所示：
[javascript] view plain copy print?
$("#visaReport").jqprint({});
这就是一个简单的操作，但是实际需要的时候，有时我们页面显示样式和我们打印的样式是有些区别的，幸好CSS声明的地方提供了一个media的属性，我们可以指定其输出的方式为print，即media=print的这个属性，写了这个属性之后，所引入CSS的一些样式在打印的时候才会生效了，通过在打印的时候，我们可以通过样式去改变当前网页的显示内容，及显示的样式。先来看下代码吧！
[html] view plain copy print?
<!DOCTYPE html>
<html>
<head>
<metacharsetmetacharset="UTF-8"/>
<title>效果测试</title>
<linkhreflinkhref="printShou.css" rel="stylesheet"type="text/css" media="print"/>
<scripttypescripttype="text/javascript"src="jquery-1.7.2.js"></script>
<scripttypescripttype="text/javascript"src="jquery.jqprint-0.3.js"></script>
<scripttypescripttype="text/javascript">
$(function()
{
$("#btn1").click(function()
{
$("#visaReport").jqprint({});
});
});
</script>
</head>
<body>
<input type="button"id="btn1" value="打印"/>
<divclassdivclass="visaReport" id="visaReport">
<divclassdivclass="visa_head">
<divclassdivclass="visa_head_title">XX中心</div>
<divclassdivclass="visa_head_title">确认及收据</div>
</div>
<divclassdivclass="visa_body">
<div>
<divclassdivclass="visa_person">
<div class="visa_label">姓名:xiaoming</div>
<div class="visa_label">日期:2014/12/30</div>
</div>
<tableclasstableclass="visa_fee">
<tr>
<td>项</td><td>价格</td>
</tr>
<tr>
<td>服务费</td><td>119.00RMB</td>
</tr>
<tr>
<td>快递费</td><td>130.00R</td>
</tr>
</table>
<tableclasstableclass="visa_total_fee">
<tr>
<tdstyletdstyle="width:207px;">Total/总计</td><td>240.00RMB</td>
</tr>
</table>
</div>
</div>
</div>
</body>
</html>
现在网页中的页面的样式是这样的：
而打印出来的效果确是第一张图的样式，这就是指定了media=print这个属性之后，打印的时候会加载一个css文件所配置的。如下所示：
[html] view plain copy print?
<link href="printShou.css" rel="stylesheet"type="text/css" media="print"/>
jqprint这个插件能够解决我们大部分开发中，Web页面打印的问题，打印的样式也是可控的。有时需要我们要为其指定一些属性，才能完成需要的效果默认是有如下的四个属性：
[javascript] view plain copy print?
{
debug: false,//如果是true则可以显示iframe查看效果（iframe默认高和宽都很小，可以再源码中调大），默认是false
importCSS: true, //true表示引进原来的页面的css，默认是true。（如果是true，先会找$("link[media=print]")，若没有会去找$("link")中的css文件）
printContainer: true,//表示如果原来选择的对象必须被纳入打印（注意：设置为false可能会打破你的CSS规则）。
operaSupport: true//表示如果插件也必须支持歌opera浏览器，在这种情况下，它提供了建立一个临时的打印选项卡。默认是true
}
如果在项目的开发中，不是要求太高的化，我想通过这个插件可以解决我们目前遇到的一些打印的问题。这个插件的操作也是特别的简单的，通过这个插件，大部分的 页面，我们都可以按照想要的样式打印出来。
热心网友
时间：2022-04-19 12:13
