js iframe 打印页面内容

2024-08-08

js打印Iframe中的内容，并且不需要预览。

js打印Iframe中的内容,并且不需要预览 js代码如下: <script type="text/javascript" language="Javascript"> function preview1() { var bdhtml = window.document.body.innerHTML; document.getElementById('PrintPath').focus(); document.getElementById('PrintP

获取iframe子页面内容高度给iframe动态设置高度

<!DOCTYPE html><html> <head> <meta charset="UTF-8" /> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <title>客户详情</title> <script src=&quo

Vue项目中将table组件导出Excel表格以及打印页面内容

体验更优排版请移步原文:http://blog.kwin.wang/programming/vue-table-export-excel-and-print.html 页面中显示的table表格,经常会要求实现导出Excel的需求,项目中刚好遇到,实现起来也比较简单,记录一下. 1.这里主要需要两个依赖:xlsx.file-saver: npm install xlsx --save npm install file-saver --save 2.组件中引入 import FileSaver f

JS调用iframe方式实现Web区域打印页面内容

1.程序说明 1) 此程序可以实现选择页面中的区域进行打印,以iframe方式进行打印: 2) 与原生态的print() 区别在于,取消打印页面后可以完整保留当前访问页面的内容. 2.代码部分 1) JS 函数: 代码如下复制代码 function do_print(id_str)//id-str 打印区域的id{ var el = document.getElementById(id_str); var iframe = document.createElement('

使用jqprint插件实现打印页面内容

业务场景客户需要在页面有一个打印按钮,点击之后可以打印Echarts图表的内容以及文字提示信息,经谷歌搜索发现,实现方法大概有三种之多,其他两种不太熟悉,而采用的这种打印方式是一个在jQuery的基本上开发的一个print插件,因此可以使用jQuery的方式查找元素,因此决定采用这种方式. 先看一下实现的效果图,如下: 实现效果图引入js文件 <script type="text/javascript" src="__JS__/jquery-migrate-1.

Swipe JS – 移动WEB页面内容触摸滑动类库

想必做移动前端的同学经常会接到这样子的一个需求,就是在移动设备页面上的banner图能够用手指触摸左右或上下的滑动切换,这在移动设备是个很常见的一个效果,其用户体验远甚于点击一个按钮区域,通过手指的触摸操作也是移动设备的中一个特性,我们必须专业化的处理,哈哈.其实实现原理很简单,但平常中自己开发不是很方便. 今天就为大家带来这样子的一个轻量级js触摸滑动类库 – Swipe JS.这是一个非常小的一个javascript类库,但他的功能却不简单,它可以用来展示web页面上的任何内容,支持精确的触

JS设置打印页面并调用本地打印机打印页面

打印页面内容，<input>不好使，用<textarea> 代替

<textarea class="sld-textarea" onchange="changeTextareaValue(this)">123</textarea> /*** 修改*/ function changeTextareaValue(obj) { $(obj).html(obj.value);} /** * 打印 */ function clickPrint(){ bdhtml = window.document.body.inne

如是使用JS实现页面内容随机显示

之前有个客户咨询我,因为他们公司的业务员有多个人,但公司网站的联系方式板块里只够放一个人的信息,所以就想能不能实现这个联系方式信息随机显示,对于业务或客服人员来说也能做到分配均匀公平.本文我们将和大家一起分享,如何使用js控制实现页面内容随机显示. 这里我以本地的蝉知建站系统为例,给大家演示一下实现流程. 首先将想要显示的不同内容分别放到不同的盒子里(div),并用ID属性标记好.例如: <div id="p1"> <p>联系人:张三</p> <

vue 打印页面部分区域

1. vue项目打印页面部分区域 2. 原生js实现页面局部打印功能 3. vue项目中将table组件导出Excel表格以及打印页面内容

js灵活打印web页面区域内容的通用方法

我们做网站,经常需要打印页面指定区域的内容,而网上关于这块的说法很多,各种各样的打印控件也不少.但许多打印方案都不怎么好,至少我不喜欢,要么封装复杂,要么难以维护.正好现在的项目也需要用到页面打印,于是在网上找了一个最简洁的打印插件,在它的基础上自己写了一个通用的打印方法,可以直观的修改样式.现在把代码贴出来,留置后用,也可以给大家一些参考. 通过这次试水,才知道,原来html中,media元素大有用途,这里正好小用一把,去掉超链接的url显示 1.网上找的js打印插件 /* * V

window.print()打印页面指定内容（使用iframe保证原页面不失效）

使用window.print()时会出现两个问题: (1)直接使用window.print() 打印的是整页内容-->无法实现打印指定区域 (2)打印时替换body中的内容,打印完成后再替换回来-->这样会导致原来页面状态失效使用iframe即可打印指定内容,也可保证页面不失效,具体方法如下: 1.将打印的内容独立出来为一个print.html文件,并为页面添加打印事件 <!DOCTYPE html> <html> <head> ... </head

js打印WEB页面内容代码大全

第一种方法:指定不打印区域使用CSS,定义一个.noprint的class,将不打印的内容放入这个class内. 详细如下: <style media=print type="text/css"> .noprint{visibility:hidden} </style> 要打印的内容.哈哈!<p class="noprint">将不打印的代码放在这里.</p><a href="javasc

基于Metronic的Bootstrap开发框架经验总结（9）--实现Web页面内容的打印预览和保存操作

在前面介绍了很多篇相关的<Bootstrap开发框架>的系列文章,这些内容基本上覆盖到了我这个Bootstrap框架的各个主要方面的内容,总体来说基本达到了一个稳定的状态,随着时间的推移可以会引入一些更好更新的内容进行完善,本篇继续这个系列,主要介绍如何实现Web页面内容的打印预览和保存操作. 1.Web页面打印的问题在此之前,我一般使用比较好用的LODOP来执行打印的操作,这个在我之前有很多文章都有涉及,这个控件是一个ActiveX的控件,需要下载安装后就可以在页面是进行打印的排版设计,预

js 在iframe子页面获取父页面元素,或在父页面获取iframe子页面的元素的几种方式

用JS或jquery访问页面内的iframe,兼容IE/FF 注意:框架内的页面是不能跨域的! 假设有两个页面,在相同域下. index.html 文件内含有一个iframe: XML/HTML代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htm

iframe子页面与父页面元素的访问以及js变量的访问

1.子页面访问父页面元素 parent.document.getElementById('id')和document相关的方法都可以这样用 2.父页面访问子页面元素 document.getElementById('iframeId').contentDocument.getElementsByTagName('table'); contentDocument后可以使用document相关方法 var tet = document.getElementById('iframeId').con

js打印页面指定区域，并去掉页眉上的时间和请求路径

需要通过js打印指定页面的内容 <style media=print type="text/css"> .noprint{visibility:hidden} </style> 然后在不需要打印的div上引用这个样式 <div class="noprint">不需要打印的内容</div> --------------------------------- <style type="text/css&qu

JS控制页面内容

JS操作页面内容 innerText:普通标签内容(自身文本与所有子标签文本)innerHTML:包含标签在内的内容(自身文本及子标签的所有)value:表单标签的内容outerHTML:包含自身标签在内的内容(自身标签及往下的所有) <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>JS处理页面内容</title> <style>

Js获取iframe子页面全局变量

项目中通过iframe内嵌了一个子页面,子页面定义了一些全局变量,父页面需要获取子页面的全局变量,做了一些测试(我的环境IE10和Firefox32.0.3),得出如下结论: IE下: window.frames['iPage'].变量名火狐下:window.frames['iPage'].contentWindow.变量名 IE&火狐下:document.getElementById('iPage').contentWindow.变量名具体原因没有深究,今天在调试一个iframe例子的

【JS】window.print打印指定内容

有时候网页用到打印但是不想打印所有内容,就需要只打印指定内容,下面简单演示下如何打印指定内容 1.在需要打印的指定内容的头部前面加“”,在尾部后面加上“”  <div> 需要打印的内容 </div>  2.添加JS代码 <script language=javascript> function d

js iframe 打印页面内容

热门专题