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是這樣包了一層，所以照葫蘆畫瓢 -_-^^