clipboard复制剪贴板功能，以及用sea.js时报错---Uncaught ReferenceError: Clipboard is not defined...

写在前面的话：

　　实现的效果： 点击一个区域，将另一个区域的内容进行复制。

---

 

clipboard 的用法，有些人已经写得很详细啦~ 感谢  白树 的  【原】js实现复制到剪贴板功能，兼容所有浏览器   这篇文章！！！

用法我就在这里贴一下clipboard.js 的用法吧：

1.下载js:  官方文档，还有下载资源 以及使用方法可参照：https://clipboardjs.com/

2.其实上面的不是重点，-_-!!! 重点是，我在使用sea.js的时候，报错：Uncaught ReferenceError: Clipboard is not defined

在sea.js 中的使用方法：

<p class="code-num" id="js-code-num">12345678</p>
<p class="copy" id="js-copy" data-clipboard-target="#js-code-num">复制</p>

<div class="clip-toast js-clip-toast hidden"></div>

点击“复制”，页面上会提示“已复制”，“12345678”就会被复制到剪贴板了，可以粘贴了~

<script src="./js/seajs/sea.js"></script>
<script src="./js/modules-config.js"></script>

<script>
seajs.use(['jquery', 'clipboard'], function($, Clipboard){

    // 剪贴板功能
    var clipboard = new Clipboard('#js-copy');
    clipboard.on('success', function(e) {
        // console.info('Action:', e.action);
        // console.info('Text:', e.text);
        // console.info('Trigger:', e.trigger);

        $('.js-clip-toast').show().html('已复制').delay(1000).hide(0);
        e.clearSelection();
    });

    clipboard.on('error', function(e) {
        // console.error('Action:', e.action);
        // console.error('Trigger:', e.trigger);
        $('.js-clip-toast').show().html('复制失败！').delay(1000).hide(0);
    });
});
</script>

坑在哪里？使用时传参，就是上边的  seajs.use(['jquery', 'clipboard'],function($,Clipboard){  //你的代码  })

Clipboard这个参数一定要写，不然就会报错：Uncaught ReferenceError: Clipboard is not defined

可怜我找了辣么久的错误…………当然，如果你的代码还有问题的话，可以在  clipboard.min.js 外面包上一层：

define(function (require, exports, module) {
        //clipboard.min.js 的代码
})

虽然我不知道为啥是这样包一层（之前未曾用过模块块加载js^^），因为我看到其他的被加载的Js是这样包了一层，所以照葫芦画瓢 -_-^^

 

转载于:https://www.cnblogs.com/Christeen/p/6874297.html