我已成功安装了clipboard.js,并在点击后获得了要复制到剪贴板的文本片段.我将把这些文本片段(或者它们所在的"btn")嵌入到表格的单元格中.
我的挑战:
我需要文本片段给我一个工具提示"复制!" 消息,以便人们知道它们是可点击的.一个很好的例子是在clipboard.js文档页面上 - 单击任何剪切或复制的按钮以查看工具提示消息.
来自clipboard.js的文档:
虽然Safari尚不支持使用execCommand执行复制/剪切操作(包括移动设备),但由于支持选择,因此优雅地降级.
这意味着你可以显示一个工具提示说复制!调用成功事件时按Ctrl + C复制调用错误事件,因为文本已被选中.
我不是特别擅长JS(我花了几个小时才能做到这一点).所以我处于死胡同......能够在WP上安装所有内容,将脚本排队,并添加文本/功能:
<!-- 1. Define some markup -->
<div id="btn" data-clipboard-text="1">
<span>text to click</span>
</div>
<!-- 2. Include library -->
<script src="/path/to/dist/clipboard.min.js"></script>
<!-- 3. Instantiate clipboard by passing a HTML element -->
<script>
var btn = document.getElementById('btn');
var clipboard = new Clipboard(btn);
clipboard.on('success', function(e) {
console.log(e);
console.info('Action:', e.action);
console.info('Text:', e.text);
console.info('Trigger:', e.trigger);
});
clipboard.on('error', function(e) {
console.log(e);
console.error('Action:', e.action);
console.error('Trigger:', e.trigger);
});
</script>
Run Code Online (Sandbox Code Playgroud)
我应该添加什么?谢谢!