繁体   English   中英

使用点击功能后刷新同一页面上的div

[英]Refresh a div on the same page after using click function

我正在使用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查询文本选取框/滚动器

 $(document).ready(function(){

所有独立工作正常。 问题是单击“打印”按钮时,文本字幕/滚动条会停止滚动文本。 在刷新页面之前,滚动器无法滚动文本。 所以我正在使用html meta刷新,但这对访问者而言可能是个烦人的经历。 我也不想在iframe中使用滚动条。

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

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

变量名称中不能包含空格。 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; 
}

根据您所说的,我认为这里的意图是仅打印特定的div,而不是整个页面。 如果是这种情况,那么您实际上将在极端情况下执行此功能。

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

如果只想打印一个div,则可以看一下jQuery print element plugin 这是一个简单的js文件,您可以将其链接到html中,然后调用

$([selector]).printElement();

仅打印该元素。 例如,您可以这样重写方法:

function printDiv(anyPrintableDiv) { 
    $('#' + anyPrintableDiv).printElement();
} 

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM