在Require.js中加入Clipboard.js的报错问题

鸡西网站制作在集成支付插件的点击复制功能时发现,在Require.js中直接加入Clipboard.js就使用复制功能的话,会报错。
折腾几次报错情况大概有以下两种:
Clipboard is not defined
或者
clipboard.on is not defined
网上找的资料解释报错原因大概是:这是因为在页面调用require.js时,Clipboard.js没有把Clipboard定义为为全局变量。,也因为Clipboard.js非规范的模块,所以,鸡西网站设计要做的就是用require.config()方法,定义它们的一些特征。相关代码如下:
首先,需要在Require.js引入Clipboard.js后添加require.config()方法
require.config({ baseUrl: APP.STATIC + '/static/js', urlArgs: 'ver=' + APP.VERSION, paths: { 'jquery' : 'libs/jquery.min', //...... 'clipboard' : 'libs/clipboard.min',//引入clipboard.js 'erphpdown' : 'erphpdown'//此文件中包含点击复制的初始化代码 }, shim: { 'clipboard': { exports: 'ClipboardJS',//重新定义点击复制的函数名 deps: ['jquery']//需要依赖jquery } } })
然后修改erphpdown.js,找到clipboard的代码修改成:
require(['clipboard'], function (ClipboardJS){//主要是这一句 var clipboard = new ClipboardJS(".erphpdown-copy"); clipboard.on('success', function(e) { $(e.trigger).text("已复制"); }); });