首页 > 其他分享 >页面打印

页面打印

时间:2024-04-25 15:34:57浏览次数:30  
标签:no 打印 innerHTML window print document 页面

一、调出打印页面直接打印

//toolbar=no,location=no,directories=no,status=no 这些特征将分别隐藏工具栏、地址栏、目录按钮和状态栏。
      window.open(routeData.href, 'newWindow', 'toolbar=no,location=no,directories=no,status=no,menubar=no');


mounted() {  
    this.print();
},
methods: 
{
print()
  {
    setTimeout(function(){    
        // //  指定元素打印。
        let oldStr = window.document.body.innerHTML;
        let newStr = document.getElementById('divPrint').innerHTML;
        window.document.body.innerHTML = newStr;
        window.print();
        window.document.body.innerHTML = oldStr;        
        }, 1000);
  }
}

<style scoped>
/* 去除页眉页脚及网址 */
@page {
  margin-top: 0;
  margin-bottom: 0
}
</style>
html js style

打印二维码问题见:https://www.cnblogs.com/xbding/p/16106168.html

标签:no,打印,innerHTML,window,print,document,页面
From: https://www.cnblogs.com/xbding/p/18157813

相关文章

  • Vue3 简单登录管理页面Demo
    目录前言项目基础配置新建项目引入组件项目配置Vue项目配置项目基本结构基础页面布局和路由搭建新增页面,简单跳转LoginViewMainViewrouterApp嵌套路由Test[1-4]Layout.vuerouter给个简单的跳转路由守护,重定向,动态路由,路由传值。这里不做展开描述简单登录页面:烂尾了总结前言这里......
  • excel 用VBA循环打印数据
    SubPrintData()DimwsAsWorksheetSetws=ThisWorkbook.Sheets("Sheet1")'修改为你的工作表名DimrngAsRangeSetrng=ws.Range("A1:D10")'修改为你的数据区域DimcellAsRangeDimiAsIntegerAp......
  • vue3 使用vant4中的List分页加载时,会回滚到页面顶部
    问题项目中使用vue3+vant4,列表页使用了List来做列表加载,代码如下:<van-listv-model:loading="loading":finished="finished"finished-text="没有更多了"@load="onLoad"><divv-if="list&&list.length"class=......
  • 七天.NET 8操作SQLite入门到实战 - (2)第七天Blazor班级管理页面编写和接口对接
    前言上一章节我们引入BootstrapBlazorUI组件完成了EasySQLite后台界面的基本架子的搭建,本章节的主要内容是Blazor班级管理页面编写和接口对接。七天.NET8操作SQLite入门到实战详细教程第一天SQLite简介第二天在Windows上配置SQLite环境第三天SQLite快速入门......
  • SpringBoot项目实现日志打印SQL明细(包括SQL语句和参数)几种方式
    前言我们在开发项目的时候,都会连接数据库。有时候遇到问题需要根据我们编写的SQL进行分析,但如果不进行一些开发或者配置的话,这些SQL是不会打印到控制台的,它们默认是隐藏的。下面给大家介绍几种常用的方法。第一种、代码形式Mybatis框架是Java程序员最常用的数据库映射框架,MyBa......
  • MAUI IOS如何弹起键盘时调整页面大小
    #ifIOSusingCoreGraphics;usingFoundation;usingMicrosoft.Maui.Platform;usingUIKit;#endifnamespaceYourProject{#nullabledisablepublicclassMainPage{ publicMainPage(){InitializeComponent();#ifIOS......
  • 鸿蒙HarmonyOS实战-ArkUI动画(页面转场动画)
    ......
  • vue路由切换滑动效果 vue页面跳转交互 vue实现动画跳转
    Hello,大家好,我是小编鹏仔,鹏仔一直觉得VUE在H5端路由跳转时交互特别丑,一直想写成那种点击滑动切换类的效果,趁着这两天工作不是很忙就网上搜了下,最终在多个搜索结果中选择了一种方式实现,效果如下图所示,点击路由跳转时是页面是滑动切换。逻辑其实还是很简单的,就是监听在路由切换时加......
  • 云打印为什么这么便宜?
    随着云打印的火热发展,越来越多的用户开始选择云打印服务了。我们在之前的内容里也介绍过,现在的易绘创云打印服务A4低至5分钱/页。那么云打印为什么这么便宜呢?今天小易就带大家来了解一下。 云打印为什么这么便宜?相信很多用户在第一次接触到易绘创云打印服务的时候总会被A4低......
  • 03_微信小程序页面之间的数据通信
     1.父传值子,数据绑定:propertiesComponent({properties:{propA:{type:String,//传递的数据类型value:''//默认值},propB:Number//简化的定义方式}})<!--引用组件的页面模板--><view><costompropA="{{name}}&quo......