关于copy到剪切板的实现需要引用Clipboard.min.js

https://pan.baidu.com/s/1eStTJlo

页面如下所示,需要实现 点击copy字样 将id为content的内容复制到剪切板中的功能

<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myModalLabel">
Daily Reprot
</h4> <a id="btn" style="float:right;padding-right:15px" data-clipboard-action="copy" data-clipboard-target="#content">
<i style="font-size:small" class="glyphicon glyphicon-file"></i>
<span style="font-size:small">Copy</span>
</a>
</div>
<div id="content"class="modal-body"> </div>
</div>

在js中填加如下代码,并设置拷贝成功提示

var clipboard = new Clipboard('#btn');

        clipboard.on('success', function (e) {
layer.msg("Copy successfully,you can paste to email directly!");
console.log(e);
}); clipboard.on('error', function (e) {
console.log(e);
});

在IE中会提示 Allow Access 点击yes即可

Angular js 复制粘贴的更多相关文章

  1. 让微信内置浏览器兼容clipboard.js 复制粘贴 ios 安卓

    <!--js copy事件--><script type="text/javascript" src="/static/js/clipboard.min ...

  2. js 复制粘贴功能记录

    最近工作中需要在前端页面中使用代码完成剪贴板的读写,网上搜索了下相应的资料,记录下... 这个功能有两个办法一个是js方式,一个是使用flash 一.JS方法 1.复制 首先复制的过程分为两步曲,无论 ...

  3. 原生js复制粘贴上传图片前后台代码,兼容firebox,chrome, ie11,亲测有效

    需求:粘贴上传图片,截图工具,右键粘贴,或者ctrl+v粘贴 方法1:可直接套用富文本框的图片上传功能,完成复制粘贴 缺点:麻烦,样式难控制 方法2:用原生js完成,以下案例基于此,样式请自己动手调整 ...

  4. js复制粘贴事件

    一.相应的事件 copy: 在发生复制操作时触发. beforecut: 在发生剪切操作 前 触发. cut: 在 发生 剪切 操作 时 触发. beforepaste: 在 发生 粘贴 操作 前 触 ...

  5. JS复制粘贴效果

    话不多说.直接上代码 HTML: 1 <div> 2 老师入会密码:<input type="text" id="tPass"> < ...

  6. js复制粘贴模板

    <script> //绑定在了body上,也可以绑定在其他可用元素行,但是不是所有元素都支持copy和past事件. /* $(document.body).bind({ copy: fu ...

  7. js 复制粘贴

    input输入框<div id="top-title" style="position: relative"> <img class=&quo ...

  8. JS复制粘贴解决方案

    var clipboardData = window.clipboardData; //for IE if (!clipboardData) { // for chrome window.prompt ...

  9. ClipboardJS复制粘贴插件的使用

    1.简单的纯JS复制粘贴(兼容性差,只能用textarea标签) var btn=document.getElementsByClassName("btn")[0]; //复制按钮 ...

随机推荐

  1. css 文本溢出省略号

    单行溢出显示省略号: white-space: nowrap; overflow: hidden; text-overflow: ellipsis; 多行溢出显示省略号: text-overflow: ...

  2. java校招一些面试的题目

    数组和链表的区别 数组静态分配内存,链表动态分配内存: 数组在内存中连续,链表不一定连续: 数组元素在栈区,链表元素在堆区: 数组利用下标定位,时间复杂度为O(1),链表定位元素时间复杂度O(n) 数 ...

  3. linux(centos6.9)下使用yum安装mysql,及启动MySQL等

    查看系统自带的mysql版本:rpm -qa | grep mysql 卸载mysql:rpm -e mysql-libs-5.1.73-8.el6_8.x86_64 --nodeps 1. 安装my ...

  4. Ubuntu安装Orcale

    Linux_Ubuntu安装oracle总结 ---------转自 https://www.2cto.com/database/201305/215338.html 话说我花了一晚上才在ubuntu ...

  5. oracle根据一张表更新另外一张表

    知道是两张表进行更新,之前作过mysql的,直接就写了: update a,b set a.code = b.code wehre a.id = b.id 然后就报错了,上网查了下知道oracle不能 ...

  6. windows电脑安装python教程

    1 版本选择 2.x版本将慢慢退出历史的舞台,建议你从3.x开始学习,本教程所使用的python版本是3.6 2 下载安装包 进入官网下载页面 https://www.python.org/downl ...

  7. Eclipse 不能调试的问题

    现象 弹出 Cannot connect to VM Console 中的输出是: ERROR: transport error 202: connect failed: Connection ref ...

  8. 项目上线后,遇到IE浏览器不显示大部分组件的问题

    document.addEventListener('touchmove',(evt)=>{ }) 以上是ES6 语法,箭头函数,当然在IE下是不行的啦. 所以改为:ES5语法 document ...

  9. maven详解 之仓库

    Maven仓库分类   MAVEN仓库分类 Maven仓库分为:本地仓库+远程仓库两大类 远程仓库又分为:中央仓库+私服+其它公共远程仓库 1,在Maven中,任何一个依赖.插件或者项目构建的输出,都 ...

  10. python Scipy积分运算大全(integrate模块——一重、二重及三重积分)

    python中Scipy模块求取积分的方法: SciPy下实现求函数的积分的函数的基本使用,积分,高等数学里有大量的讲述,基本意思就是求曲线下面积之和. 其中rn可认为是偏差,一般可以忽略不计,wi可 ...