ZeroClipBoard 复制粘贴插件

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' );

来自为知笔记(Wiz)

转载于:https://www.cnblogs.com/notniu/p/4487814.html