本文展示了如何使用JavaScript实现网页中的表格一键打印功能。通过监听打印按钮的点击事件，获取表格元素，并将其内容注入到新开的窗口中，然后调用打印接口，完成表格的打印操作。
<!DOCTYPE>
<html>
<head>
<style>
}
</style>
</head>
<body>
<div id="printTable" >
<table border="1" align="center" padding="0" border-collapse="collapse">
<tr>
<td>姓名</td>
<td>sex</td>
<td>身份证</td>
<td>电话</td>
</tr>
<tr>
<td>张三</td>
<td>15</td>
<td>132131</td>
<td>12313</td>
</tr>
<tr>
<td>李四</td>
<td>16</td>
<td>132131</td>
<td>12313</td>
</tr>
<tr>
<td>王五</td>
<td>18</td>
<td>132131</td>
<td>12313</td>
</tr>
</table>
</div>
<button id="print">打印</button>
<script>
window.onload = function()
{
var btnPrint = document.getElementById("print");//“打印”按钮
btnPrint.onclick = function()//为“打印”按钮添加点击事件
{
printTable();//打印表格
}
}
//打印表格
function printTable()
{
var tableToPrint = document.getElementById('printTable');//将要被打印的表格
var newWin= window.open("");//新打开一个空窗口
newWin.document.write(tableToPrint.outerHTML);//将表格添加进新的窗口
newWin.document.close();//在IE浏览器中使用必须添加这一句
newWin.focus();//在IE浏览器中使用必须添加这一句
newWin.print();//打印
newWin.close();//关闭窗口
}
</script>
</body>
</html>
js打印实现
最新推荐文章于 2022-11-21 20:00:00 发布
扫一扫
1921
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
