您的位置：首页 > 运维架构

用window.print()打印指定div里面的内容

2016-06-03 11:09 204 查看

今天客户让添加个打印证照功能，直接用window.print()打印的是整个页面，而用以下方法就可以只打印证明了


<html>
<head>
<script language="javascript">
function printdiv(printpage)
{
var headstr = "<html><head><title></title></head><body>";
var footstr = "</body>";
var printData = document.getElementById("dvData").innerHTML; 获得 div 里的所有 html 数据
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>

同理：

用 JavaScript 实现页面数据的打印：主要是用到了一个 print() 函数，该函数将会打印整个 web 页面 body 内的所有 html 数据 ! 使用方法为 window.print(); 打印页面上局部的数据，则可以用

//把数据嵌套在一个 div 里，获得 div

var printData = document.getElementById("dvData").innerHTML; 获得 div 里的所有 html 数据

window.document.body.innerHTML = printData;   //把 html 里的数据复制给 body 的 html 数据，相当于重置了整个页面的内容

window.print(); // 开始打印

这种打印方式的优劣：消耗资源少 | 格式不够灵活

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： Lodrop

相关文章推荐

新的分享

章节导航