关于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. bootstrap fileinput控件上传文件大小限制

    部分js: language: "zh",//设置语言 showCaption: true,//是否显示标题 showUpload: true, //是否显示上传按钮 showPr ...

  2. 【Luogu4448】 [AHOI2018初中组]球球的排列

    题意 有 \(n\) 个球球,每个球球有一个属性值 .一个合法的排列满足不存在相邻两个球球的属性值乘积是完全平方数.求合法的排列数量对 \(10^9+7\) 取膜. \(n\le 300\) (本题数 ...

  3. JS实现全选,取消全选,正常选择

    //点击选择方法 onUserIdsChange(selVal) { if (this.form.groupUserIds.includes(-1) && !this.isSelect ...

  4. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 图片:图片响应式 (将很好地扩展到父元素)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  5. gitlab clone或者pull 仓库

    今天在学git操作,想从gitlab上面clone下来并操作一下,但是一直出现 没有权限的错误,一直搞不定 后来才知道,需要ssh密钥才可以 ssh-keygen -t rsa -C "ex ...

  6. HomePod即将发售,但硬件不再是苹果的救命稻草

    流年不利的苹果,在多个维度都遭到了重创.除了与高通纠缠不清的专利官司外,iPhone销量还直线下滑并影响到营收.最终,苹果股价.市值都处于暴跌态势.面对内外夹击的不利局面,苹果信奉多年的"封 ...

  7. docker 为镜像添加ssh服务-使用Dockerfile 创建

    首先,基于要添加内容的镜像ubuntu:18.04运行一个容器, 在宿主机(下面步骤是在容器中创建的,应该在宿主机创建进行以下步骤) 一.创建一个工作目录 二.创建Dockerfile 和脚本run. ...

  8. centos搭建gitlib

    sudo yum install -y curl policycoreutils-python openssh-server sudo yum -y install postfixsudo syste ...

  9. 吴裕雄--天生自然java开发常用类库学习笔记:取得当前日期

    import java.util.* ; // 导入需要的工具包 class DateTime{ // 以后直接通过此类就可以取得日期时间 private Calendar calendar = nu ...

  10. JuJu团队12月2号工作汇报

    JuJu团队12月2号工作汇报 JuJu   Scrum 团队成员 今日工作 剩余任务 困难 于达 和婷婷一起调试main.jl 继续调试 金华实现的BiLSTM参数无法使用save存入 婷婷 和于达 ...