关于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. IPython 自动重载魔术

    在开启IPython 后输入下列命令就可以开启Ipython 的自动重载 %load_ext autoreload %autoreload 2 当你在IPython中导入的函数或类发生修改时,IPyt ...

  2. 学习 Ansible Playbook,有这篇文章就够了!

    https://mp.weixin.qq.com/s?__biz=MzAwNTM5Njk3Mw==&mid=2247487361&idx=1&sn=b50327df2949e4 ...

  3. 二、Linux目录结构&常用指令

    Linux目录结构: ps -ef:任务管理器 ifconfig: 查看ip ping :  测试与目标主机的连通性,ctrl+c停止 目录指令: ll:列出当前目录下的文件信息 ls -al : 列 ...

  4. java有参

    一.带参数的方法 语法: 访问修饰符  方法返回值类型   方法名称 (参数列表){ // 方法体 注意:每个参数之间用","分割 二.形参和实参 形参:在方法定义时指定的参数 实 ...

  5. 发送短信-----用restful 校验规则

    我们的需求如下 1. 获取手机号 . 手机格式校验 . 生成随机验证码 . 验证码发送到手机上 . 把验证码+手机号保留(30s过期) 复习 我们在有表的情况下的序列化 class MessageSe ...

  6. 5G/NR OTA (Over The Air) 测试详解

    原文链接:http://www.sharetechnote.com/html/5G/5G_OTA.html 1 什么是OTA (Over The Air) OTA代表Over The Air.为了使用 ...

  7. 2-10 就业课(2.0)-oozie:2、介绍和安装1

    oozie的安装及使用 1.  oozie的介绍 Oozie是运行在hadoop平台上的一种工作流调度引擎,它可以用来调度与管理hadoop任务,如,MapReduce.Pig等.那么,对于Oozie ...

  8. jenkins#安装gitlab

    通过docker安装gitlab 参考 ------------------------------ 拉docker 镜像: docker pull gitlab/gitlab-ce 创建目录存储gi ...

  9. vue :is 属性

    为什么使用 :is ?DOM模板解析说明: 当使用DOM作为模板时(例如,将el选项挂载到一个已知的元素上),你会受到HTML的一些限制,因为Vue只有在浏览器解析和标准化HTML后才能获取模板内容. ...

  10. IQueryable 转DataTable

    public static DataTable CopyToDataTable<T>(IEnumerable<T> array) { var ret = new DataTab ...