MENU

Clipboard.js 跳出多次复制成功的问题及其解决

March 9, 2023 • PHP

首先第一次进来点击,复制按钮,弹出:复制成功,这是没问题的,但是返回上级界面再次进来的时候 再次点击复制的时候会 弹出两次复制成功,据实践总结这是因为第一次来 var clipboard = new Clipboard('.btn-copy-'+index);的时候实例化了一次,然后再次点击方法的时候又执行了一次,如果每次不去销毁clipboard,界面就会实例化N+1次,我们必须要销毁本次实例,代码如下:

var clipboard = new Clipboard('.btn-copy-' + row.id);

clipboard.on('success', function (e) {
    Toastr.success('复制成功');
    clipboard.destroy(); //销毁本次实例化
});

clipboard.on('error', function (e) {
    Toastr.error('复制失败');
    clipboard.destroy(); //销毁本次实例化
});