ZeroClipboard.config is not a function 和 ZeroClipboard is not defined 错误解决

soゝso 2016-10-25 14:41:38 636
分享到:

ZeroClipboard.config is not a function。

第二次出现这个错误了。上一次忘记怎么解决的,这次又遇到了,把问题阐述一下,方便查阅。

ZeroClipboard.config({
	moviePath: "/js/common/ZeroClipboard.swf",
	hoverClass: "btn-clipboard-hover"
})

这么去定义的时候,控制台出现这个错误,发现抛出ZeroClipboard.config is not a function。出现这个问题,我总结了一下,有2点原因:

  • 重复引用ZeroClipboard.js ,怎么排查?先看是否引入了2个,再看是否有js文件中已经包含了ZeroClipboard.js。
  • 版本问题。我现在遇到的是版本问题。

我的问题是,原来的代码是用version为1.3.5,ZeroClipboard v1.3.5  可以这么去用,而我项目中已经在cdn 上有这个ZeroClipboard.js ,那我为了高效的利用,直接用原来的,就出现这个问题了。后来发现以前用的是version是1.2.1,导致出了问题。

而低版本的配置应该是这么去用的。

new ZeroClipboard(so(".copy_btn"),{
	moviePath: "/js/common/ZeroClipboard.swf",
	hoverClass: "btn-clipboard-hover"
})

解决问题了。

咱们再说说 ZeroClipboard is not defined 这个是 ZeroClipboard  找不到。

其实解决方案就百度一下就知道了,我这里总结下解决途径和方案:

一、确定加载顺序,是否在ZeroClipboard.js 加载之前使用,解决调整好加载顺序,先加载ZeroClipboard.js。

二、使用require.js也会导致加载不到,这个时候解决方案有2种。

1.修改源码(下策)。

if (typeof define === "function" && define.amd) {
    define(function() {
        return ZeroClipboard;
    });
} else if (typeof module === "object" && module && typeof module.exports === "object" && module.exports) {
    module.exports = ZeroClipboard;
} else {
    window.ZeroClipboard = ZeroClipboard;
}

改成这样:

if (typeof define === "function" && define.amd) {
define(function() {
  return ZeroClipboard;
});
} else if (typeof module === "object" && module && typeof module.exports === "object" && module.exports) {
module.exports = ZeroClipboard;
}
//主要是这里
window.ZeroClipboard = ZeroClipboard;

如果你的源码是这样。

//......
"function" == typeof define && define.amd ? define(["require", "exports", "module"], function(a, b, c) {
        return t = c && c.id || null, p
    }) : "object" == typeof module && module && "object" == typeof module.exports && module.exports ? (u = module.id || null, module.exports = p) : window.ZeroClipboard = p

那么这是三元运算符(三目运算)表达方式,你也可以不用动它,直接在后面加上如下代码:

"function" == typeof define && define.amd ? define(["require", "exports", "module"], function(a, b, c) {
	return t = c && c.id || null, p
}) : "object" == typeof module && module && "object" == typeof module.exports && module.exports ? (u = module.id || null, module.exports = p) : window.ZeroClipboard = p;
//在后面加上这个就OK了。
window.ZeroClipboard = p;

2.增加代码(上策)

require.config({
    baseUrl: '',
    paths: {
        ZeroClipboard: "/common/ZeroClipboard.min"//定义ZeroClipboard
    }
});
require(['ZeroClipboard'], function (ZeroClipboard) {
    window['ZeroClipboard'] = ZeroClipboard;
	//or window.ZeroClipboard = ZeroClipboard;
});

因为引入后就变成私有,类似于封装一样,提供一个公共的访问方法。那就是给window。


关于作者
目前就职于国内某电商平台公司打杂。。
相关文章
Spring 3.x 升级到Spring 4.x 注意事项步骤,错误解决方法
JS中 “is not defined” 如何判断defineddefinedundefined 的区别
火狐(Firefox )浏览器提示。此链接是不受信任的,站长用户的解决方案。SSL申请
N多系统单点登录,实现、解决方案。四种解决方案
Shiro对Session操作doReadSession、update频繁读取更新问题说明
Java 解析JSON,JSON-LIB jar包下载使用。
JSON格式讲解,JSON获取对象,JSONObjectJSONArray的操作
IOS 中 urldecode 如何解码后,解码后“+”(加号)空格处理方式
IE、Firefox对同一域名访问并发限制,及解决优化方案
Java 信任所有SSL证书,HTTPS请求抛错,忽略证书请求完美解决
最新文章
免费天气API,全国天气 JSON API接口,可以获取五天的天气预报 38754
JS解密,JavaScript 解密,任何JS加密都能100%解密,以及JS 加密讲解 66
阿里云DNS 解析讲解,SEO配置搜索引擎线路解析 41
百度秒收录教程,怎么做到百度秒收入你的页面,SEO 教程 89
CDN 请求返回 connection reset by peer,被拦截请求解决方案 33
Google AdSense 申请技巧,谷歌广告申请通不过教程 66
Mac 安装 JMeter,JMeter 下载,JMeter Http 压力测试【图解】 45
支付宝吱口令自动复制脚本,自动复制 JavaScript 代码介绍 866
谈谈这次对 SOJSON 的改版 146
Java 计算2个时间相差多少年,多少个月,多少天的几种方式 484
最热文章
免费天气API,全国天气 JSON API接口,可以获取五天的天气预报 38754
Elasticsearch教程(四) elasticsearch head 插件安装和使用 108910
Elasticsearch教程(六) elasticsearch Client创建 73264
Elasticsearch教程(八) elasticsearch delete 删除数据(Java) 70727
Elasticsearch教程(二),IK分词器安装 67441
Elasticsearch教程(三),IK分词器安装 (极速版) 54071
Elasticsearch教程(五) elasticsearch Mapping的创建 51534
Elasticsearch教程(一),全程直播(小白级别) 51227
Elasticsearch教程(七) elasticsearch Insert 插入数据(Java) 47703
Elasticsearch权威指南-中文.pdf,Elasticsearch 中文文档下载 40877

骚码加入我们 / 千人QQ群:259217951

入群需要5元,如果没有QQ钱包,可以先Alipay、微信,赞助然后加群主拉进。

二维码生成 来自 >> 二维码生成器

支付扫码

所有赞助/开支都讲公开明细,用于网站维护:赞助名单查看

正在加载... ...