ZeroClipboard

1.   
引用js

1
<script type="text/javascript" src="/ZeroClipboard.js"></script>

2.Html

1
2
3
4
5
6
7
<input id="fe_text" cols="50" rows="5" value="复制内容文本2" />
 
<button id="btnCopy">复制</button>
 
<input id="fe_text2" cols="50" rows="5" value="复制内容文本20" />
 
<button id="btnCopy2">复制</button>

由于在页面上需要复制两个文本框,这里便设置了两个文本框,两个复制按钮为例

3.JS

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
function init(txtid, btnid) {
 
    //设置flash路径:就算和js在同一路径下,也推荐设置
 
    ZeroClipboard.setMoviePath('/js/zeroclipboard/ZeroClipboard.swf');
 
    //1.实例化ZeroClipboard
 
    var clip = new ZeroClipboard.Client();
 
    //2.设置手型模式---其实就是放在元素上,变成小手的样子
 
    clip.setHandCursor(true);
 
    //3.设置监听事件,复制文本框中内容
 
    clip.addEventListener('mouseOver', function (client) {
 
        clip.setText($('#' + txtid).val());
 
    });
 
    //4.设置复制完成时触发事件--提示完成
 
    clip.addEventListener('complete', function (client, text) {
 
        alertSuccess((txtid == 'URL2' ? "url复制成功" : "token复制成功") + ",请在公众号中做相应设置");
 
    });
 
    //5.绑定按钮
 
    clip.glue(btnid);
 
}

在页面加载完成后调用:

1
2
3
init('fe_text', 'btnCopy');
 
init('fe_text2', 'btnCopy2');

ZeroClipBoard 复制粘贴插件的更多相关文章

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

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

  2. 复制粘贴插件(不包含 Flash)——clipboard.js

    clipboard.js是现代化的“复制到剪切板”插件.不包含 Flash.gzip 压缩后仅 3kb.不依赖 Flash 或其他臃肿的框架.API:https://clipboardjs.com c ...

  3. ZeroClipboard跨浏览器复制粘贴

    <!DOCTYPE html> <html> <head> <title>ZeroClipboard跨浏览器复制粘贴</title> < ...

  4. 通过如何通过js实现复制粘贴功能

    在ie中window.clipboardData(剪切板对象)是可以被获取,所以利用这个方法我们可以实现在IE当中复制粘贴的功能,demo如下! <html> <head> & ...

  5. js 复制粘贴功能记录

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

  6. 使用ZeroClipboard 复制指定内容到剪切板

    有些时候,我们希望让用户在网页上完成某个操作就能自动将指定的内容复制到用户计算机的剪贴板中.但是出于安全原因,大多数现代浏览器都未提供通用的剪贴板复制接口(或即便有,也默认被禁用).只有IE浏览器可以 ...

  7. H5复制粘贴

    H5 复制粘贴 - execCommand 字数748 阅读399 评论0 喜欢0 需求:自动复制一段内容到剪切板, 让用户可以在其他客户端粘贴(发小广告做推广经常要用吧) window.clipbo ...

  8. C# WinForm:DataTable中数据复制粘贴操作的实现

    1. 需要实现类似于Excel的功能,就是在任意位置选中鼠标起点和终点所连对角线所在的矩形,进行复制粘贴. 2. 要实现这个功能,首先需要获取鼠标起点和终点点击的位置. 3. 所以通过GridView ...

  9. pycharm无法使用ctrl+c/v复制粘贴的问题

    最近在使用pycharm的时候发现不能正常使用ctrl+c/v进行复制粘贴,也无法使用tab键对大段代码进行整体缩进.后来发现是因为安装了vim插件的问题,在setting里找到vim插件,取消勾选即 ...

随机推荐

  1. Android Monkey Test

    Monkey测试是Android自动化测试的一种手段,Monkey测试本身非常简单,就是模拟用户的按键输入,触摸屏输入,手势输入等,看设备多长时间会出异常.当Monkey程序在模拟器或设备运行的时候, ...

  2. MD5加密算法原理及实现

    MD5消息摘要算法,属Hash算法一类.MD5算法对输入任意长度的消息进行运行,产生一个128位的消息摘要. 以下所描述的消息长度.填充数据都以位(Bit)为单位,字节序为小端字节. 算法原理 1.数 ...

  3. YBC中国国际青年创业计划

    YBC中国国际青年创业计划 中国青年创业国际计划(简称YBC)是共青团中央.中华全国青年联合会.中华全国工商业联合会共同倡导发起的青年创业教育项目.该项目参考总部在英国的青年创业国际计划( Youth ...

  4. Redis事务和分布式锁

    Redis事务 Redis中的事务(transaction)是一组命令的集合.事务同命令一样都是Redis最小的执行单位,一个事务中的命令要么都执行,要么都不执行.Redis事务的实现需要用到 MUL ...

  5. 提交时提示错误This Bundle is invalid.New apps and app updates submitted to the App Store must be built wit

    this bundle is invalid . new apps and app updates submitted to the app store must be built with publ ...

  6. C#中的枚举类型

    浅谈C#中的枚举  转自http://www.cnblogs.com/liyingyi/archive/2005/12/28/306772.aspx   枚举类型是一种的值类型,它用于声明一组命名的常 ...

  7. How to Use the UTL_MAIL Package

    APPLIES TO: PL/SQL - Version 10.1.0.2 and laterInformation in this document applies to any platform. ...

  8. Quartz 2D 概述

    Quartz 2D是一个二维图形绘制引擎,支持iOS环境和Mac OS X环境.我们可以使用Quartz 2D API来实现许多功能,如基本路径的绘制.透明度.描影.绘制阴影.透明层.颜色管理.反锯齿 ...

  9. Java学习之finally关键字总结

    Java中的final关键字非常重要,它可以应用于类.方法以及变量.这篇文章中我将带你看看什么是final关键字?将变量,方法和类声明为final代表了什么?使用final的好处是什么?最后也有一些使 ...

  10. iframe中调用父iframe中的方法

    function getRootWin(){       var win = window;       while (win != win.parent){            win = win ...