浏览器打印功能去除页眉页脚保留页码解决方案

最新推荐文章于 2021-06-03 20:24:37 发布

Jason搬运工

最新推荐文章于 2021-06-03 20:24:37 发布

阅读量3.7k

点赞数 2

分类专栏：方案总结文章标签：打印页码谷歌浏览器打印

本文链接：https://blog.youkuaiyun.com/weixin_43893696/article/details/100067242

版权

方案总结专栏收录该内容

0 篇文章

订阅专栏

本文介绍了一种在谷歌浏览器中打印文档时仅保留页码而去除页眉页脚的方法，通过JavaScript动态添加页码，适用于需要精确控制打印输出的场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

浏览器打印功能去除页眉页脚保留页码解决方案

需求是要在谷歌浏览器上打印时显示每页页码，但不能出现其余页眉页脚信息，经过网上查找发现原生的谷歌打印并没有办法区分页码和其他页眉页脚的信息，于是只能用土办法了
解决办法：

let bodyEle = $('body');
//获取页面总长度
let bodyHeight = bodyEle.height();
//获取页数 1430：单页A4纸总高度（不同得浏览器打印高度不一致，根据自己需求调整）
let count = bodyHeight/1430;
//动态添加页码 通过绝对定位
for(let i = 0; i < count; i++){
	let foot = '<div style="position:absolute;top:' + 1430*(i+1) + 'px;left:40px;font-size:20px;font-weight:600">' + (i + 1) + '<div>';
	bodyEle.append(foot);
}