jQuery：暂时toggleClass / addClass，removeClass？

Question

我将以下代码与ZeroClipboard 一起使用来更改我的“复制到剪贴板按钮”的innerHTML 文本和类。单击后，这会为类转换设置动画。

client.on( "complete", function(client, args) {
            this.innerHTML = 'Copied to Clipboard';
            $( this ).removeClass( "btn-info" ).addClass( "btn-success", 357 );         
            });

有没有一种方法可以临时更改类和innerHTML？即只更改类（更改为btn-success）几秒钟以指示单击了按钮，然后自动恢复到原来的类（btn-info）？并删除添加的innerHTML = 'Copied to Clipboard'

所以类转换将是“btn-info”>“btn-success”>“btn-info”。并将innerHTML 恢复为之前的状态（每个按钮都有不同的innerHTML）。

我尝试过使用 toggleClass，但运气不佳。

Answer 1

尝试使用简单的超时

client.on("complete", function (client, args) {
    var html = this.innerHTML;
    this.innerHTML = 'Copied to Clipboard';
    var $this = $(this).removeClass("btn-info").addClass("btn-success");

    //clear previous timer
    clearTimeout($this.data('completeToggler'))
    var timer = setTimeout(function () {
        $this.addClass("btn-info").removeClass("btn-success");
        $this.html(html)
    }, 2000);
    $this.data('completeToggler', timer);
});

演示：Fiddle

---

也可以尝试使用 toggleClass()

client.on("complete", function (client, args) {
    this.innerHTML = 'Copied to Clipboard';
    var $this = $(this).toggleClass("btn-info btn-success");
    setTimeout(function () {
        $this.toggleClass("btn-info btn-success");
    }, 2000)
});