0

我正在使用一个 java 脚本打印功能,该功能在点击时打印页面的预定义 div。功能如下:

<head>
<script type="text/javascript">
function printDiv(any printable div) {      
var printContents = document.getElementById(any printable div).innerHTML;      
var originalContents = document.body.innerHTML;       
document.body.innerHTML = printContents;       
window.print();       
document.body.innerHTML = originalContents; 
} 
</script>
</head>

打印机表单输入法和可打印的div如下:

<body>
<input type="button" class="button" onclick="printDiv('any printable div')" name="print" value="print" />
<div id = "any printable div"> On button click contents here are printed </div>
</body>

我还在同一页面上使用 j-query 文本选框/滚动条,根据函数执行任务

 $(document).ready(function(){

一切都可以独立工作。问题是当点击打印按钮时,文本选框/滚动条停止滚动文本。在页面刷新之前,滚动条无法滚动文本。所以我正在使用 html 元刷新,但这对访问者来说可能是一种恼人的体验。我也不想在 iframe 中使用滚动条。

这次我已经尝试了一些基于 j-query 和 java 脚本的解决方案。脚本刷新(只是淡入淡出整个文本块)滚动条静默但实际上无法保持文本滚动的 div。

是否有任何好的基于 j-query 或 java 脚本的解决方案可以根据我在上面解释的情况在给定时间段内静默刷新滚动条 div?

4

2 回答 2

0

变量名中不能有空格。function printDiv(any printable div)是语法错误。

请尝试:

function printDiv(elId) {      
    var printContents = document.getElementById(elId).innerHTML;      
    var originalContents = document.body.innerHTML;       
    document.body.innerHTML = printContents;       
    window.print();       
    document.body.innerHTML = originalContents; 
}
于 2012-07-11T12:06:43.920 回答
0

我从您所说的内容中假设,这里的目的是能够仅打印某个 div,而不是整个页面。如果是这种情况,那么您真的会在这里执行此功能。

如果您只想制作更漂亮的页面版本(没有菜单等),请查看如何在打印或打印预览时使用不同的 CSS?. 该问题将展示如何使用一组不同的 css 进行打印,因此您可以设置为打印display:none;时不想显示的任何内容。

如果您只想打印一个 div,那么您可以查看jQuery 打印元素插件。这是一个简单的 js 文件,您在 html 中链接然后调用

$([selector]).printElement();

只打印那个元素。例如,您可以这样重写您的方法:

function printDiv(anyPrintableDiv) { 
    $('#' + anyPrintableDiv).printElement();
} 
于 2012-07-11T12:12:07.133 回答