Javascript ajax成功后如何重置默认按钮

我使用jquery在状态期间更改按钮样式（bootstrap&fontsawesome）。单击按钮时，按钮将变为加载。一旦成功数据从ajax响应。按钮更改为“完成”。但完成后，我需要将按钮重置为默认状态

代码如下：

    $(document).ready(function(){
        $("#printBtn button").click(function(){         
            $("#printBtn").html('<button type="button" class="btn btn-default btn-sq-lg disabled"><em class="fa fa-spinner fa-spin fa-5x"></em><br /><span>Printing...</span></button>');
            setInterval(function() {
            $.ajax({
                type: 'POST',
                url: 'inc/prvw_print.php',
                success: function(data) {
                    if(data=='success'){
                            $("#printBtn").html('<button type="button" class="btn btn-success btn-sq-lg"><em class="fa fa-check fa-5x"></em><br /><span>Done</span></button>');
                            setInterval(function() {
                                $("#printBtn").html('<button type="button" class="btn btn-danger btn-sq-lg"><em class="fa fa-print fa-5x"></em><br /><span>Print?</span></button>');
                            },500);
                        }else{                      
                            $("#printBtn").html('<button type="button" class="btn btn-warning btn-sq-lg"><em class="fa fa-warning fa-5x"></em><br /><span>Error</span></button>');
                    }//if
                }//success
            });//ajax
        },1000);//interval
        });//click
   });//ready

$（文档）.ready（函数（）{
$（“#打印BTN按钮”）。单击（函数（）{
$（“#printbn”）.html（“
打印…”）；
setInterval（函数（）{
$.ajax({
键入：“POST”，
url:'inc/prvw_print.php'，
成功：功能（数据）{
如果（数据=='success'）{
$（“#printbn”）.html（“
完成”）；
setInterval（函数（）{
$（“#printbn”）.html（“
Print？”）；
},500);
}否则{
$（“#printbn”）.html（“
错误”）；
}//如果
}//成功
})；//ajax
}，1000）；//间隔
})；//单击
});//准备好的

我再次在

if（data='success'）

中添加了setInterval。希望它能在0.5秒后重置默认按钮。但事实并非如此。示例如下：

---

此处的工作更新：

您将

setInterval

误认为是

setTimeout

，因此您当前正以这种方式每x秒发出一次ajax请求。以下是我的建议，它在JSFIDLE上不起作用，因为它没有您在实际应用程序中请求的URL：

$(document).ready(function() {
  $("#printBtn button").click(function() {
    $("#printBtn").html('<button type="button" class="btn btn-default btn-sq-lg disabled"><em class="fa fa-spinner fa-spin fa-5x"></em><br /><span>Printing...</span></button>');
    setTimeout(function() {
      $.ajax({
        type: 'POST',
        url: '',
        success: function(data) {
            if (data == 'success') {
              $("#printBtn").html('<button type="button" class="btn btn-success btn-sq-lg"><em class="fa fa-check fa-5x"></em><br /><span>Done</span></button>');
              setTimeout(function() {
                $("#printBtn").html('<button type="button" class="btn btn-danger btn-sq-lg"><em class="fa fa-print fa-5x"></em><br /><span>Print?</span></button>');
              }, 500);
            } else {
              $("#printBtn").html('<button type="button" class="btn btn-warning btn-sq-lg"><em class="fa fa-warning fa-5x"></em><br /><span>Error</span></button>');
            } //if
          } //success
      }); //ajax
    }, 1000); //interval
  }); //click
}); //ready

$（文档）.ready（函数（）{
$（“#打印BTN按钮”）。单击（函数（）{
$（“#printbn”）.html（“
打印…”）；
setTimeout（函数（）{
$.ajax({
键入：“POST”，
url:“”，
成功：功能（数据）{
如果（数据==“成功”）{
$（“#printbn”）.html（“
完成”）；
setTimeout（函数（）{
$（“#printbn”）.html（“
Print？”）；
}, 500);
}否则{
$（“#printbn”）.html（“
错误”）；
}//如果
}//成功
})；//ajax
}，1000）；//间隔
})；//单击
}); //准备好的

$（文档）.ready（函数（）{
$（“#打印BTN按钮”）。单击（函数（）{
$（“#printbn”）.html（“
打印…”）；
$.ajax({
键入：“POST”，
url:'inc/prvw_print.php'，
成功：功能（数据）{
如果（数据==“成功”）{
$（“#printbn”）.html（“
完成”）；
setTimeout（函数（）{
$（“#printbn”）.html（“
Print？”）；
}, 500);
}否则{
$（“#printbn”）.html（“
错误”）；
}//如果
}//成功
})；//ajax
})；//单击
});//准备好的

为什么不添加禁用的属性，然后将其删除，而不是将其作为类添加？添加/删除禁用的

不会更改文本和图标。是否尝试设置超时？而不是setIntervalIt保持从
btn success
切换到
btn danger
ETERNATION.@Wilf我指的不是您要添加的类。我指的是禁用属性：是的。我建议您阅读自己没有编写的函数的规范。如果您以前没有使用过这些功能，那就表示非常感谢您的建议。我只是从jquery开始。@Wilf不客气。看看代码学校的JavaScript内容，它可能会非常有用。Magnudae，关于这一点的其他问题。为什么按钮刷新后操作不起作用？？？
$(document).ready(function(){
        $("#printBtn button").click(function(){ 
            $("#printBtn").html('<button type="button" class="btn btn-default btn-sq-lg disabled"><em class="fa fa-spinner fa-spin fa-5x"></em><br /><span>Printing...</span></button>');

            $.ajax({
                type: 'POST',
                url: 'inc/prvw_print.php',
                success: function(data) {
                    if (data == 'success'){

                            $("#printBtn").html('<button type="button" class="btn btn-success btn-sq-lg"><em class="fa fa-check fa-5x"></em><br /><span>Done</span></button>');

                            setTimeout(function() {
                                $("#printBtn").html('<button type="button" class="btn btn-danger btn-sq-lg"><em class="fa fa-print fa-5x"></em><br /><span>Print?</span></button>');
                            }, 500);

                    } else {
                            $("#printBtn").html('<button type="button" class="btn btn-warning btn-sq-lg"><em class="fa fa-warning fa-5x"></em><br /><span>Error</span></button>');
                    }//if
                }//success
            });//ajax

        });//click
   });//ready