网页打印功能常常需要精细控制页眉页脚。本文探讨如何通过JavaScript或CSS取消浏览器打印设置中页眉页脚的默认勾选。 近期，有用户反馈，使用JavaScript和printJS插件时，无法通过代码取消默认勾选，且@media print样式失效。
用户代码片段如下，使用html2canvas和printJS打印图片：
html2canvas(this.$refs.templateToImg, {
backgroundColor: null,
useCORS: true,
windowHeight: document.body.scrollHeight,
}).then(canvas => {
dom.style.height = 'calc(100vh - 400px)'
dom.style.overflow = 'auto'
const url = canvas.toDataURL('image/jpg')
this.img = url
const styles = "@media print { @page {height: 100%;@top-left {content: '页首内容';}@bottom-center {content: '页脚内容';}}}" // 无效
printJS({
printable: url,
type: 'image',
documentTitle: this.previewTitle(),
style: styles,
onLoadingEnd: () => {
this.printLoading = false
dom.style.height = 'auto'
dom.style.overflow = 'visible'
}
})
})经分析，浏览器打印设置属于系统级功能，用户在打印对话框中手动控制。虽然@media print可自定义打印样式，但无法直接影响浏览器打印设置的默认勾选状态。 printJS插件的打印机制与标准浏览器打印机制不同，导致@media print样式失效。
因此，目前无法通过编程手段取消浏览器打印设置中的页眉页脚默认勾选。建议用户打印前手动调整打印设置，或探索其他间接实现方法。
立即学习“Java免费学习笔记（深入）”；
以上就是如何通过JavaScript或CSS取消浏览器打印设置中的页首及页尾默认勾选？的详细内容，更多请关注php中文网其它相关文章！
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
999
收藏
