js打印页面图片(批量)

html代码：

<body><button onclick="printThisWindow()">打开</button>
</body>

js代码

let list = `<div class="imgBox">`for (var i = 0; i < 10; i++) {//防止批量打印时打印界面重复调用if(i == 0){list += `<img src="https://scpic.chinaz.net/files/pic/pic9/202110/hpic4550.jpg" style="width: 842px;height: 600px;" onload="___imageLoad___()"/>`;}else{list += `<img src="https://scpic.chinaz.net/files/pic/pic9/202110/hpic4550.jpg" style="width: 842px;height: 600px;"/>`;}}list += `</div>`function printThisWindow() {let iframe = document.createElement('IFRAME')let doc = nulliframe.setAttribute('class', 'print-iframe')iframe.setAttribute('style', 'position:absolute;width:0px;height:0px;left:-500px;top:-500px;')document.body.appendChild(iframe)doc = iframe.contentWindow.document// 取一个不重复的方法名称，可以随机字符串doc.___imageLoad___ = function () {iframe.contentWindow.print()if (navigator.userAgent.indexOf('MSIE') > 0) {document.body.removeChild(iframe)}}doc.write(`${list}`)doc.close()iframe.contentWindow.focus()}

js打印页面图片(批量)相关推荐

利用 JS 判断页面图片静态资源链接是否有效是否加载完成
文章目录一.功能说明二.动图效果展示三.完整源代码一.功能说明利用原生 JS 实现对图片静态资源链接是否有效进行判断: 如果资源链接有效,直接渲染: 如果资源链接失效,3秒后替换新的链接,进 ...
关于打印页面图片被截断
当html 页面打印的时候,上下两页出现图片被截断的情况,如下思路: 需要达到的效果是,当打印一页不够时,整个图片到下一页打印,图片不被截断解决办法:(.seal包裹每个图章的类) @media ...
js打印页面指定区域内容
2种方式: 一种只支持IE浏览器另一种支持各类浏览器 <html xmlns="http://www.w3.org/1999/xhtml"> <head> ...
WebView与JS的那些事：注入JS提取页面图片
上一篇博文中,我们大概了解了js与webview的一些交互,然而,在我们实际的应用中,更倾向于在android端对网页做一些处理,今天带给大家的是往页面注入JS脚本,提取页面上的图片,然后通过另一个A ...
JS打印页面指定区域
错误的写法: //打印 functionprintPage(areaId) {if (parent.$("#PrinFrame").length == 0) {parent.$(& ...
基于js实现页面图片消除
前两天测试的时候发现自己对js还不是太熟悉,所以今天上传的了这篇文章,重新写了一下js模块里面的东西. 核心还是这一部分: i = 0 last = null function clickDisapp ...
html JS打印添加水印图片
参考链接 https://www.cnblogs.com/zxyun/p/6210101.html html <div class="big-div"><div ...
js 页面打印，兼容单个打印和分页批量打印，自定义页眉和简单页脚
场景: 最近在公司做开发,有个需求需要页面打印功能,作为前端半桶水都不到,只会改页面的我,一脸懵逼,公司里也没人系统的做过,按照惯例,本着有事找度娘的心态(我一直认为我们现在遇到的70%-80%的问题 ...
使用JS打印网页内容及图片
1.利用jQuery打印插件jqprint:jquery.jqprint-0.3.js ; 2. window.print()的JS编写: <!DOCTYPE html> <html ...

js打印页面图片(批量)

js打印页面图片(批量)

js打印页面图片(批量)相关推荐

最新文章

热门文章