Angular js 复制粘贴
关于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 复制粘贴的更多相关文章
- 让微信内置浏览器兼容clipboard.js 复制粘贴 ios 安卓
<!--js copy事件--><script type="text/javascript" src="/static/js/clipboard.min ...
- js 复制粘贴功能记录
最近工作中需要在前端页面中使用代码完成剪贴板的读写,网上搜索了下相应的资料,记录下... 这个功能有两个办法一个是js方式,一个是使用flash 一.JS方法 1.复制 首先复制的过程分为两步曲,无论 ...
- 原生js复制粘贴上传图片前后台代码,兼容firebox,chrome, ie11,亲测有效
需求:粘贴上传图片,截图工具,右键粘贴,或者ctrl+v粘贴 方法1:可直接套用富文本框的图片上传功能,完成复制粘贴 缺点:麻烦,样式难控制 方法2:用原生js完成,以下案例基于此,样式请自己动手调整 ...
- js复制粘贴事件
一.相应的事件 copy: 在发生复制操作时触发. beforecut: 在发生剪切操作 前 触发. cut: 在 发生 剪切 操作 时 触发. beforepaste: 在 发生 粘贴 操作 前 触 ...
- JS复制粘贴效果
话不多说.直接上代码 HTML: 1 <div> 2 老师入会密码:<input type="text" id="tPass"> < ...
- js复制粘贴模板
<script> //绑定在了body上,也可以绑定在其他可用元素行,但是不是所有元素都支持copy和past事件. /* $(document.body).bind({ copy: fu ...
- js 复制粘贴
input输入框<div id="top-title" style="position: relative"> <img class=&quo ...
- JS复制粘贴解决方案
var clipboardData = window.clipboardData; //for IE if (!clipboardData) { // for chrome window.prompt ...
- ClipboardJS复制粘贴插件的使用
1.简单的纯JS复制粘贴(兼容性差,只能用textarea标签) var btn=document.getElementsByClassName("btn")[0]; //复制按钮 ...
随机推荐
- Nginx反向代理实现负载均衡配置图解
Nginx反向代理实现负载均衡配置图解 [导读] 负载均衡配置是超大型机器需要考虑的一些问题,同时也是数据安全的一种做法,下面我来介绍在nginx中反向代理 负载均衡配置图解,大家可参考本文章来操作. ...
- Lesson 6 The sporting spirit
How does the writer describe sport at the international level? I am always amazed when I hear people ...
- P1090 危险品装箱
1090 危险品装箱 (25分) 集装箱运输货物时,我们必须特别小心,不能把不相容的货物装在一只箱子里.比如氧化剂绝对不能跟易燃液体同箱,否则很容易造成爆炸. 本题给定一张不相容物品的清单,需要你 ...
- 定时执行 Job【转】
Linux 中有 cron 程序定时执行任务,Kubernetes 的 CronJob 提供了类似的功能,可以定时执行 Job.CronJob 配置文件示例如下: ① batch/v2alpha1 是 ...
- Linux 只复制目录,不复制目录下数据文件
[root@yoon u02]# mkdir yoon [root@yoon u02]# mkdir hank [root@yoon yoon]# mkdir -p 1/data [root@yoon ...
- Java常考面试题(二)(转)
序言 昨天刚开始的"每日5题面试"这类文章,感觉还不错,把一些平常看似懂了的东西,弄清楚了.就像什么是虚拟机?这个问题,看起来知道,但是要说出个所以然来,又懵逼了,经常回过头来看看 ...
- xcode windows版安装使用教程
随着iPhone.iPad.Mac等苹果产品越来越火爆,越来越多的初学者想要了解和尝试苹果平台,包括苹果操作系统Mac OS X.苹果演示软件Keynote.苹果开发工具Xcode等.然而,苹果电脑价 ...
- 单选与多选与label
单选radio和多选checkbox是用name属性关联的 相同的name就相当于同一道题 <input type="radio" name="radio" ...
- PHP使用ElasticSearch做搜索
PHP 使用 ElasticSearch 做搜索 https://blog.csdn.net/zhanghao143lina/article/details/80280321 https://www. ...
- react 如何引入打印控件 CLodop
下载插件,官网地址 http://www.lodop.net/download.html ,选择综合版,解压下载的文件.直接点击 安装,很简单,就不一一说明了. 复制下面几个文件,到react项目中 ...