问题描述
我发现了这个 change button text after click w/ clipboard.js
但它会导致错误:$ is not a function,见下面的截图
https://www.awesomescreenshot.com/image/8535357?key=55d48e1db3b3e996966454c551958fac
在某人通过类而不是ID点击按钮后,如何使用Clipboard.js更改按钮文本?
例如,按钮文本将更改为“已复制”,一段时间后它会自动变回原始文本。
下面是我的代码:
解决方法
在没有 success
的情况下使用 jQuery
事件
https://clipboardjs.com/#events
var clipboard = new ClipboardJS('.copyElement')
clipboard.on('success',function(e) {
let oldtext = e.trigger.textContent
e.trigger.textContent = 'Copied!'
setTimeout(() => e.trigger.textContent = oldtext,2000)
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.8/clipboard.min.js"></script>
<button class="copyElement" data-clipboard-text="123">
<span>Take Me There 1</span>
</button>
<button class="copyElement" data-clipboard-text="456">
<span>Take Me There 2</span>
</button>