clipboard.js - Clipboard.js 不适用于小测试
问题描述
我遇到了一个小问题,我尝试使用clipboard.js,但即使在我的测试中它也不起作用。我的html如下,请告诉我我做错了什么。
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<meta name="description" content="test" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script>
</head>
<body content="text/html">
<button class="btn" data-clipboard-demo="" data-clipboard-action="copy" data-clipboard-text="Just because you can doesn't mean you should — clipboard.js">Copy to clipboard</button>
</body>
</html>
解决方案
您需要在元素上初始化剪贴板 js。将此添加到您的页面:
<script>new ClipboardJS('.btn')</script>
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<meta name="description" content="test" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script>
</head>
<body content="text/html">
<button class="btn" data-clipboard-demo="" data-clipboard-action="copy" data-clipboard-text="Just because you can doesn't mean you should — clipboard.js">Copy to clipboard</button>
</body>
<script>new ClipboardJS('.btn');</script>
</html>
推荐阅读
- clojure - 使用匿名函数宏时的mapcat arity错误
- postgresql - 安装 postgres-12 时 libpq.so.5 文件不可用
- c++ - 矢量调整大小快捷方式?
- python - pandas前后两行滚动总和
- flutter - Firebase 前台推送通知
- python - 带有列表列表的字典
- flutter - Flutter:DropdownButton不起作用,我加载了数据但它没有出现在界面中
- python - 从 QPersistentModelIndex 获取 QModelIndex
- javascript - 如何在 javascript 中区分 + 和 4 虚拟代码?
- bluetooth - IoT hub azure - ble 设备和 pwa 应用程序