结束脚本后隐藏微调器加载答案

【问题标题】：hide spinner load after end script结束脚本后隐藏微调器加载
【发布时间】：2020-04-18 16:04:12
【问题描述】：

我试图在 AJAX 调用开始时显示微调器，并在 AJAX 调用结束时隐藏它。问题是脚本结束后我无法隐藏微调器。

有人有什么想法吗？

<form>
  <div class="row">
    <div class="col-xl-3 col-md-6">
      <div class="card bg-primary text-white mb-4">
        <div class="card-body">Carica directory</div>
        <div class="card-footer d-flex align-items-center justify-content-between">
          <a id='firstAlimentazione' class="small text-white stretched-link" href="#">View Details</a>
          <div class="small text-white">
            <i class="fas fa-angle-right"></i></div>
          <div id="spinnerLoad" class="spinner-border" role="status" style="display: none">
            <span class="sr-only">Loading...</span>
          </div>
        </div>
      </div>
    </div>
</form>

$(function() {
  $('a#firstAlimentazione').bind('click', function() {
    spinner = $('#spinnerLoad');
    spinner.show();
    $.getJSON('/firstScript', function(data) {
      spinner.hide()
    });
    return false;
  });
});

【问题讨论】：

您的代码是否在您的 ajax 调用结束时被命中？您是否尝试在其中添加console.log(...) 以找出答案？
只要 AJAX 调用成功，代码应该可以工作。这要么意味着 click 处理程序没有运行，要么 AJAX 失败。无论哪种情况，请检查控制台是否有错误。另请注意，bind() 已被弃用很长时间。您应该考虑改用on()
但不幸的是，我无法弄清楚如何以正确的方式进行 ajax 调用

标签： jquery html flask bootstrap-4

【解决方案1】：

在你的 ajax 代码中使用成功函数。

【讨论】：