阿新

js实现复制到剪贴板
js实现复制到剪贴板jQuery ZeroClipboard实现复制到剪贴板功能项目需要在web页面点击复制内容到...
扫描右侧二维码阅读全文
14
2018/04

js实现复制到剪贴板

js实现复制到剪贴板

jQuery ZeroClipboard实现复制到剪贴板功能

项目需要在web页面点击复制内容到剪贴板,在网上搜了一个类库Zero Clipboard,Zero Clipboard作为一个独立的js库,它利用 Flash 进行复制,需要两个文件:ZeroClipboard.js 和 ZeroClipboard.swf,github地址:https://github.com/zeroclipboard/ZeroClipboard

html代码:


    <button id="copt-btn">点击复制单中的文本</button>
    <input type="text" id="input" value="输入要复制的内容" />

javascript代码:

$('#opt-btn').zclip({
        path: "./ZeroClipboard.swf",
        copy: function(){
            return $(''#input'').val(); //复制的内容
        },
        afterCopy: function () { alert("复制成功!"); } /!* 复制成功后的操作 *!/
    });

clipboard.js实现复制到剪贴板(含移动端ios复制)

由于Zero Clipboard实现复制到剪贴板功能需要依赖flash,当浏览器禁止flash的时候,页面就比较的难看了,不要急,还有一个更优秀的插件来了:clipboard.js。
取代flash复制到剪切板,更好页面性能,不会造成卡顿想象,不止兼容PC端,还优雅的兼容移动端ios的safari浏览器。
项目地址:https://github.com/zenorocha/clipboard.js
官方介绍有更详细的api介绍,这里就不写例子了。

Last modification:August 13th, 2018 at 11:28 pm
If you think my article is useful to you, please feel free to appreciate

2 comments

  1. 肆意的青春

    大神,方便加下你联系方式吗?

Leave a Comment