剪贴板.js：JavaScript API上发生非法构造函数错误

Question

I'm trying to run a Copy URL event using clipboard.js. I have it installed on my server and the reference to clipboard.js is there in my code. So I have this in my footer:

<script type="text/javascript">
     var url = document.location.href;

    new Clipboard('.btn', {
        text: function() {
    return url;
  }
});
</script>

And this simply for my button:

<button class="btn">Copy</button>

Simple. And there's an example on SO that does work: Copy URL from browser using clipboard.js

But mine is throwing an Illegal Constructor error on my script and I'm really puzzled as to why. Am I forgetting something that's causing this error to appear?

Here's the Stack example: Copy URL from browser using clipboard.js

Here's what I got: https://dadventuresla.com/copy-link-test/

Answer 1

as per https://clipboardjs.com/ it should be ClipboardJS

<script type="text/javascript">
     var url = document.location.href;

    new ClipboardJS('.btn', {
        text: function() {
    return url;
  }
});
</script>

Answer 2

You have a typo - looking at the Clipboard docs , it shows you need to use ClipboardJS not Clipboard :

<script type="text/javascript">
    var url = document.location.href;
    new ClipboardJS(".btn", {
        text: function() {
            return url;
        }
    });
</script>