jQuery：临时toggleClass / addClass，removeClass？

debugcn 发表于 Dev

伊利亚·保罗

我在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进行实验，但是运气还不够。

阿伦·P·约翰尼（Arun P Johny）

尝试使用简单的超时

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);
});

演示：小提琴

也尝试使用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)
});

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。