zeroclipboard是走的flash插件,手机浏览器是不支持的,所以不得不舍弃之,用clipboard,clipboard不需要flash就可以完成复制剪切等功能,而且可以兼容pc,移动端,下面介绍如下

下面这个js插件能实现
<!DOCTYPE html>    
<html lang="en">    
<head>    
    <meta charset="UTF-8">    
    <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>   
    <script src="https://cdn.jsdelivr.net/clipboard.js/1.5.12/clipboard.min.js"></script>    
    <title>移动端复制到剪贴板!</title>    
</head>    
<body>    
<p>哈哈<span id="target">你没看错,就是复制的这里</span></p>    
<button class="btn" data-clipboard-action="copy" data-clipboard-target="#target" id="copy_btn">    
    复制按钮    
</button>    
    
</body>    
<script>    
    $(document).ready(function(){    
        var targetText=$("#target").text();    
        var clipboard = new Clipboard('#copy_btn');    
    
        clipboard.on('success', function(e) {    
            console.info('Action:', e.action);    
            console.info('Text:', e.text);    
            console.info('Trigger:', e.trigger);    
            alert("复制成功");    
    
            e.clearSelection();    
        });    
    });    
</script>    
</html>

如果项目中用到了 requirejs,会出现 Uncaught ReferenceError: Clipboard is not defined,可是文件确实都引入进去了的,死活找不到答案,最好各种百度菜找到答案,

这是因为在有requirejs时,Clipboard不会把自己暴露为全局变量。

可以把Clipboard定义到requirejs的配置模块,然后如下使用:

define(['clipboard'],function(clipboard){
window['Clipboard']=clipboard;

    var clipboard = new Clipboard('.copy-button');
    clipboard.on('success', function(e) {
    layer.msg("复制成功");
    e.clearSelection();
});

大功告成,总算完成

});

参考:https://github.com/3yteam/personalDemo/tree/master/projectSummary/copy

clipboard复制剪贴板功能,以及用requirejs时报错---Uncaught ReferenceError: Clipboard is not defined的更多相关文章

  1. vue项目中引入mui.poppicker.js文件时报错“Uncaught ReferenceError: mui is not defined”

    解决:在mui.js的源文件后最后加上 window.mui = mui;

  2. Android Clipboard(复制/剪贴板)

    Android提供的剪贴板框架,复制和粘贴不同类型的数据.数据可以是文本,图像,二进制流数据或其它复杂的数据类型. Android提供ClipboardManager.ClipData.Item和Cl ...

  3. Firefox37.0.1+selenium 2.53+python3.6打开浏览器时报错NameError: name 'basestring' is not defined

    环境:Win7      Firefox浏览器版本37.0.1      Python36      Selenium2.53.0 在Pycharm里执行以下3行脚本: from selenium i ...

  4. js实现点击按钮复制文本功能

    最近项目活动中用到复制文本功能,发现在chrome中之前的clipboard的demo失效了,查了下发现是因为版本升级导致的.最新用法如下: <!DOCTYPE html> <htm ...

  5. Zero Clipboard - 跨浏览器兼容的“复制到剪贴板”功能

    开发中经常会用到复制的功能,在 IE 下实现比较简单,但要想做到跨浏览器比较困难了. 本文将介绍一个跨浏览器的库类 Zero Clipboard ,它利用 Flash 进行复制,所以只要浏览器装有 F ...

  6. 【转】js实现复制到剪贴板功能,兼容所有浏览器

    两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...

  7. 【原】js实现复制到剪贴板功能,兼容所有浏览器

    两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...

  8. 黄聪:JS实现复制到剪贴板功能,兼容所有浏览器(转)

    两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...

  9. JS pc端和移动端共同实现复制到剪贴板功能实现

    JS pc端和移动端实现复制到剪贴板功能实现 在网页上复制文本到剪切板,一般是使用JS+Flash结合的方法,网上有很多相关文章介绍.随着 HTML5 技术的发展,Flash 已经在很多场合不适用了, ...

随机推荐

  1. Easyui数据表格-地区列表及工具栏增删改

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...

  2. Linux_脚本安装包(以Webmin的安装为例)

    1.Webmin下载地址:https://sourceforge.net/projects/webadmin/files/webmin/        版本使用1.820 2.解压Webmin     ...

  3. 【BZOJ 1875】【SDOI 2009】HH去散步

    水啊水,最后ans别忘了%哦! #include<cstdio> #include<cstring> #include<algorithm> using names ...

  4. CodeForces 450B 矩阵

    A - Jzzhu and Sequences Time Limit:1000MS     Memory Limit:262144KB     64bit IO Format:%I64d & ...

  5. jquery.ui.widget详解

    案例详解 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <titl ...

  6. 一起学HTML基础-格式与布局fixed/absolute/relative/z-index/float

    很多网页都存在一个悬浮的操作条或者广告区,无论如何上下滚动网页,操作条或广告区都不会动,这个就是div制作,位置锁定在屏幕指定位置,现在我们就学习下网页的格式与布局. position 位置,来给di ...

  7. vim——打开多个文件、同时显示多个文件、在文件之间切换

    打开多个文件: 1.vim还没有启动的时候: 在终端里输入  vim file1 file2 ... filen便可以打开所有想要打开的文件 2.vim已经启动 输入 :open file 可以再打开 ...

  8. C# JSon转换

    1. 先添加System.Web.Extensions.dll引用   var js = new System.Web.Script.Serialization.JavaScriptSerialize ...

  9. 【板子】gcd、exgcd、乘法逆元、快速幂、快速乘、筛素数、快速求逆元、组合数

    1.gcd int gcd(int a,int b){ return b?gcd(b,a%b):a; } 2.扩展gcd )extend great common divisor ll exgcd(l ...

  10. 用git管理源代码

    自从做iOS开发的一年多以来,之前一直都是用svn进行代码管理.因为工作需要,我也开始用git管理源代码.关于git的基本使用,在此做一个详细的介绍,希望能对初次接触git的人有所帮助! 本篇博客针对 ...