<div class="Invoice-cont" id="copyAll">

<div>1234</div>

<div>张三</div>

<div>.....</div>

</div>

<button  @click="copy">复制</button>

//点击复制收款信息

copy(){

const range = document.createRange(); //创建range对象

range.selectNode(document.getElementById('copyAll')); //获取复制内容的 id 选择器

const selection = window.getSelection();  //创建 selection对象

if (selection.rangeCount > 0) selection.removeAllRanges(); //如果页面已经有选取了的话,会自动删除这个选区,没有选区的话,会把这个选取加入选区

selection.addRange(range); //将range对象添加到selection选区当中,会高亮文本块

document.execCommand('copy'); //复制选中的文字到剪贴板

this.tips({

title: '成功',

message: '复制成功!',

type: 'success',

});

selection.removeRange(range); // 移除选中的元素

}

vue js 复制div区域内容相关推荐

  1. Vue实现复制excel表格内容粘贴至网页

    Vue实现复制excel表格内容粘贴至网页 有一个项目要求复制excel表格内容粘贴至网页表格,并且自动生成格式(合并单元格等) (别问为什么不直接上传excel表格,用户不喜欢...) 最后决定的做 ...

  2. jquery js 设置 div 的内容,给 div 添加一个属性

    设置 div 的内容的写法: jquery 的写法:    $( "#div1" ).html( "aa" );    // 将 div1 元素里面的 html ...

  3. js 复制文本框内容

    ElementObj.select();//选中input框或textarea文本域的内容 document.execCommand("Copy");// 执行浏览器复制命令 说明 ...

  4. JS打印指定区域内容

    /*将页面内要打印的内容加入中间<!--startprint1-->XXXXX<!--endprint1-->,再加个打印按纽 οnclick=preview(1)*/ fun ...

  5. div区域内容抓取_企业微信群机器人应用:使用python从网站抓取行业资讯并定时推送...

    在企业经营过程中,及时了解行业相关信息(市场动态.竞品策略.行业数据等等)是非常必要的.通常情况下,商品部门.营销部门.市场部门可能都会安排专门的人员定期进行这些信息的搜集.整理,再进行内部的分享. ...

  6. (vue基础试炼_01)使用vue.js 快速入门hello world

    文章目录 一.需求案例 二.案例实现 2.1. 原始js写法 2.2. 怎样使用vue.js ? 2.3. 使用vue.js 写法 三.案例vue简述? 四.案例趣味延伸 五.表达值作用及嘱咐语 一. ...

  7. Vue.js 核心精要实战解析

    课程简介 前端框架领域,Angular.React.Vue.js 三足鼎立,而 Vue.js 因其性能.通用.易用.体积.学习成本低等特点深受广大前端们的追捧,并吸引了一大批前端初学者.作为 Vue. ...

  8. vue.js 2.x教程

    教程 基础 安装 兼容性 Vue 不支持 IE8 及以下版本,因为 Vue 使用了 IE8 无法模拟的 ECMAScript 5 特性.但它支持所有兼容 ECMAScript 5 的浏览器. 更新日志 ...

  9. Vue.js 框架基础笔记

    Vue.js 框架基础笔记 1. Vue.js 基本概念 1.1 遇见 Vue.js 1.1.1 为什么要学习 Vue.js 1.1.2 前端开发的复杂化 1.1.3 Vue.js 特点 1.1.4 ...

最新文章

  1. 【发现】iframe 放入 Updatepanel 中没有作用,整页总要闪烁一次的解决办法
  2. windows tomcat 升级openssl_Linunx开发环境配置——Tomcat
  3. java反射 修改静态方法的值 setAccessible
  4. python thread模块_【Python@Thread】thread模块
  5. 如何解决PHP上传中文出错,如何解决php上传中文乱码的问题
  6. 微软TTS语音引擎实现文本朗读
  7. vsCode PlatformIO + jlink + GD32VF103
  8. 水经注万能地图下载器如何导出透明TIF标签
  9. Android 获取本地视频列表
  10. 【修炼五】用户需求系统需求
  11. 新服务器如何设置共享硬盘,Windows Server 2012 iSCSI如何搭建共享磁盘教程
  12. “2019年新出的境外云闪付是什么?
  13. java中的文件存储_File存储 - 文件存储
  14. 手机 APP 的卖货界面
  15. Thymeleaf模板(全程案例详解)
  16. 一个微信小程序开发示例
  17. 欧几里得算法求解最大公因数详解
  18. 基于c语言实现的个人理财系统,基于Android的个人理财系统—设计和实现-论文最终版.doc...
  19. 深入浅出内存管理-- 伙伴系统(buddy system)
  20. rtmp over quic直播服务--mediago

热门文章

  1. 什么是连接池,其工作原理是什么?
  2. optimizer(三) Adam 系列
  3. android 耳机监听权限,android 耳机监听
  4. JavaScript制作的时钟
  5. 速来,围观阿里出品的泰山版Java开发手册
  6. 【深度之眼Python基础+数据科学入门训练营】第八章 文件、异常和模块
  7. html5无序列表,有序列表,定义列表,组合标签,div分区标签
  8. 风火编程--python发邮件email
  9. python中 “按位与,或,异或”与C语言的不同
  10. Linux中安装配置jdk