如何创建一个加载微调器(javascript-ajax)

时间:2018-02-26 01:31:48

标签: javascript jquery ajax

我正在使用javascript,jquery,ajax

如何创建此加载微调器?在以下URL

上看到了这一点

我在下面编写了以下代码,但我不确定如何在成功功能中添加代码,它们有超时功能,但它看起来与我的代码不同。

                               $('#content').html('<img id="loader-img" alt="" src="http://adrian-design.com/images/loading.gif" width="100" height="100" align="center" />');
                               $.ajax({
                                   type: "POST",
                                   url: "Checkout_Payment.aspx/ChargeCreditCard",
                                   data: '{NameVB: "' + NameJS + '"}',
                                   contentType: "application/json; charset=utf-8",
                                   dataType: "json",
                                   success: OnSuccess,
                                   failure: OnFailure,
                                   error: OnError
                               });
                               function OnSuccess(response) {
                                   var getResponse = response.d;
                                   if (getResponse.indexOf('success') >= 0) {
                                       var order_ID_Array = getResponse.split("_");
                                       var order_ID = order_ID_Array[1];
                                       window.location.href = "Checkout_Receipt.aspx?OID=" + order_ID ;
                                   }
                               }

1 个答案:

答案 0 :(得分:1)

你几乎就在那里,你需要hide ajax success之后的图像

$('#content').html('<img id="loader-img" alt="" src="http://adrian-design.com/images/loading.gif" width="100" height="100" align="center" />');
$.ajax({
type: "POST",
url: "Checkout_Payment.aspx/ChargeCreditCard",
data: '{NameVB: "' + NameJS + '"}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: OnSuccess,
failure: OnFailure,
error: OnError
});
function OnSuccess(response) {
  $("#loader-img").hide(); //REMOVES THE LOADING UPON RECEIVING RESPONSE
   var getResponse = response.d;
   if (getResponse.indexOf('success') >= 0) {
     var order_ID_Array = getResponse.split("_");
     var order_ID = order_ID_Array[1];
     window.location.href = "Checkout_Receipt.aspx?OID=" + order_ID ;
   }
}