Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/479.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何将分割文本替换为“;收到了”;在使用clipboard.js单击并使其在几秒钟后消失之后?_Javascript_Jquery_Clipboard.js - Fatal编程技术网

Javascript 如何将分割文本替换为“;收到了”;在使用clipboard.js单击并使其在几秒钟后消失之后?

Javascript 如何将分割文本替换为“;收到了”;在使用clipboard.js单击并使其在几秒钟后消失之后?,javascript,jquery,clipboard.js,Javascript,Jquery,Clipboard.js,我想把“div”的文本改为“copied!”只需几秒钟,然后在特定的时间段后返回原始文本 这是代码的一个示例: <!DOCTYPE html> <html lang="en"> <body <div class="row"> <div class="box col-xs-2 btn red1 integration-checklist__copy-button" id="#E44236" data-clipboard-text="#E

我想把“div”的文本改为“copied!”只需几秒钟,然后在特定的时间段后返回原始文本

这是代码的一个示例:

<!DOCTYPE html>
<html lang="en">

<body

<div class="row">

    <div class="box col-xs-2 btn red1 integration-checklist__copy-button" id="#E44236" data-clipboard-text="#E44236"><p>#E44236</p></div>
    <script>
        var clipboard = new ClipboardJS('.btn');

        clipboard.on('success', function(e) {
            e.clearSelection();
            e.trigger.textContent = 'Copied!';
        });

        clipboard.on('error', function(e) {
            console.info(e);
        });
    </script>

您需要使用来实现这一点。下面的代码在您复制文本1000毫秒后运行“计时器”功能。您可以随意将该值更改为您喜欢的任何值

var clipboard = new ClipboardJS('.btn');

clipboard.on('success', function (e) {
    e.clearSelection();
    e.trigger.textContent = 'Copied!';

    var interval = setInterval(timer, 1000);
    function timer() {
        e.trigger.textContent = e.text;
        clearInterval(interval);
    }
});

clipboard.on('error', function (e) {
    console.info(e);
});

我们可以使用jquery setTimeout实现这一点,如下所示:

  clipboard.on('success', function(e) {
    $(e.trigger).text("Copied!");
    e.clearSelection();
    setTimeout(function() {

//let x = get the original text for this control and reset again after some time    
$(e.trigger).text("original text");
    }, 2500);}
我们还可以使用jquery显示隐藏淡出方法,如:

var clip = new Clipboard('.btn');
clip.on('success', function(e) {
    $('.copied').show();
    $('.copied').fadeOut(1000);
});

非常感谢。它帮助我完成了我的项目。当然