vue打印指定区域内容

vue项目-打印页面中指定区域的内容（亲测有效！）

关于打印整个页面的,没什么好说的.今天我给大家分享一个打印指定区域的方法,你想打印哪里,就打印哪里! 我也是刚刚开始接触打印这一块功能的,然后当然是找度娘深入了解了一番啦,期间试了网上的各种方法,有的压根就没效果: 有的可以实现打印部分区域的页面,但是在打印界面会丢失样式,那样子界面会很丑:下面我会列出网上的部分方法,以及我的方法.(插件我没有试过~) 网上方法一:(该方法我在vue页面使用没有做到指定区域打印,而是打印全部) 网上方法二:(该方法我在vue页面使用可以做到打印部分区域,但是样式

js打印div指定区域内容

关于MVC打印问题，打印指定的内容

首先你的内容一定要放在一个div中如下代码 <div id="divprint"> <table class="table table-striped dataTable table-bordered" id="DataTables_Table_0" aria-describedby="DataTables_Table_0_info"> <thead> <tr role="r

vue将指定区域的表格数据或element-ui中el-table的数据单笔或多笔批量导出excel

公司在后台管理系统开发中用到了 vue+element-ui 组合的框架,但随着需求的越来越复杂,前端的工作难度也呈几何倍数递增,工作量随之增大.这不,在项目中增加一个将列表数据导出为excel的需求就紧跟着来了. 不光将数据导出,还得支持单笔导出或多笔批量导出. 前端:前端招谁惹谁了? 产品:入了前端门,生是前端人,死是前端鬼! 前端: 产品: 为了生活,我们已经殚精竭虑:为了工作,我们已经竭尽全力! 有需求,哭着也得实现啊.于是上网搜了一通,果然让我发现了解决之道:xlsx.file-sav

js调用浏览器打印指定div内容

--打印按钮事件 function printForm(){ var headstr = '<html xmlns:th="http://www.thymeleaf.org">'+ '<head>'+ '<style type="text/css">'+ 'table-bordered>thead>tr>th, .table-bordered>tbody>tr>th,

js打印指定元素内容

var v = document.createElement("div"); //向v中追加打印数据,可以将界面的元素追加进来 var h = window.open("打印窗口", "_blank"); h.document.write( $(v).prop("outerHTML")); h.document.close(); h.print(); h.close();

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

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

web页面实现指定区域打印功能

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

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

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

打印web页面指定区域的三种方法

本文和大家分享一下web页面实现指定区域打印功能的三种方法,一起来看下吧. 第一种方法:使用CSS 定义一个.noprint的class,将不打印的内容放入这个class内. 代码如下: <style media="print" type="text/css"> .noprint{visibility:hidden} </style>这里是要打印的内容.<p class="noprint">这里是不打印的内

Jquery 插件PrintArea 打印指定的网页区域

Jquery 插件PrintArea 打印指定的网页区域需要下载jquery 和printarea.js插件 PrintArea.Js插件,可以打印整个网页中某个指定的区域. $("打印区域").printArea(); $("打印区域") 这个只会打印该区域内的内容(innerHTML),不会打印整个区域outHtml

用window.print()打印指定div里面的内容（转载的）

用window.print()打印指定div里面的内容今天客户让添加个打印证照功能,直接用window.print()打印的是整个页面,而用以下方法就可以只打印证明了  <html> <head> <script language="javasc

用window.print()打印指定div里面的内容

用window.print()打印指定div里面的内容今天客户让添加个打印证照功能,直接用window.print()打印的是整个页面,而用以下方法就可以只打印证明了  <html> <head> <script language="javasc

JS达到Web指定保存的和打印功能的内容

背景首先,说说文章的背景.近期手中的一个项目,因为需求中要求提供Web界面的打印功能.当然假设没有打印机,还能够提供保存到本地.项目组长把这个"小任务"分给了我.本着努力为组长分忧解难的思想,领了任务之后,就立即開始了工作. 问题刚開始的时候.组长给了一个工具(jatoolsprinter)让我研究.我用了一个多小时的时间,做出了一个简单的Demo,然后就是各种的測试,因为 web 打印须要浏览器安装 ActiveX 组件.在随后的測试中,我用了几款浏览器.甚至把安全级别都调到了最

在ASP.NET2.0里打印网页指定的内容（比如打印网页里的一个Table）

原文:在ASP.NET2.0里打印网页指定的内容(比如打印网页里的一个Table) 打印指定内容: <html> <head> <script type= "text/javascript " language= "javascript "> function printPage() { var newWin = window.open( 'about:blank ', ' ', ' '); v

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

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

微信小程序导出当前画布指定区域的内容并生成图片保存到本地相册(canvas)

最近在学小程序,在把当前画布指定区域的内容导出并生成图片保存到本地这个知识点上踩坑了. 这里用到的方法是: wx.canvasToTempFilePath(),该方法作用是把当前画布指定区域的内容导出生成指定大小的图片,并返回文件路径.(详情看文档) 这里先来分析一下这句话:导出当前画布指定区域的内容并生成图片 .这里以画一个矩形并将该矩形保存到本地相册为例. 首先我们要做的是先在画布上画一个矩形,其次是利用 wx.canvasToTempFilePath()方法导出画布指定区域的内容,这里当

css控制打印时只显示指定区域

CreateTime--2017年9月26日08:16:04 Author:Marydon css控制打印时只显示指定区域思路: 1.使用打印命令@media print: 2.控制执行打印命令时,非打印区域隐藏. CSS代码 <style type="text/css"> /* 执行打印命令时,非打印区域隐藏(不会被打印出来) */ @media print{ #noPrintDiv { display:none; } } </style> HTML代码

vue 打印

vue 方法第一种方法:通过npm 安装插件 1,安装 npm install vue-print-nb --save 2,引入安装好以后在main.js文件中引入 import Print from 'vue-print-nb' Vue.use(Print); //注册 3,现在就可以使用了 <div id="printTest" > <p>锄禾日当午</ <p>汗滴禾下土 </ <p>谁知盘中餐</p>

WPF打印控件内容

当我们想打印控件内容时,如一个Grid中的内容,可以用WPF中PrintDialog类的PrintVisual()方法来实现界面如下: XAML代码如下 <Grid> <Grid.ColumnDefinitions> <ColumnDefinition/> <ColumnDefinition Width="300"/> </Grid.ColumnDefinitions> <Grid Grid.Column="

vue打印指定区域内容

热门专题