如何结束我的 ajax-loader.gif？

Question

我正在使用 OpenCart，并且我有一系列对用户隐藏的 AJAX 调用，并且需要一些时间来加载。我想显示一个 ajax-loader gif，但我是新手，不知道如何编写代码。 AJAX 调用在单击结帐按钮时开始，并被带到结帐页面。 ajax-loader.gif 将在结帐页面上，并在 AJAX 运行并且适当的信息填充页面上的 div 时结束。

我对 AJAX 几乎一无所知。如果需要，请提示我提供更多详细信息。

我尝试显示/隐藏 div 的背景图片：

<script language="Javascript" type="text/javascript">
  $('#confirm.checkout-heading').css("background-image", "url('../image/ajax-loader.gif')");
  $.ajax({
    url: 'opencart/index.php?route=checkout/checkout',
    success: function(data) {},
    failure: function(){},
    complete: function(){ $('#confirm.checkout-heading').css("background-image", "none"); }
  });
</script>

CSS：

#confirm .checkout-heading {
    background: #fff url('../image/ajax-loader.gif') 98% 50% no-repeat;
}

Answer 1

如果你使用 jquery，那么你可以以成功、错误或任何情况结束..

$('#loader').show();
$.ajax({
  url: 'backend.php',
  success: function(data) {},
  failure: function(){},
  complete: function(){ $('#loader').hide(); }
});