javascript - 第一次后 Ajax 加载屏幕未显示

Question

我正在使用 AJAX 从我的网页调用 servlet。到目前为止一切顺利，我添加了一些代码来在 servlet 工作时显示加载屏幕，但这仅在第一次有效，之后调用 servlet，我可以更改光标，但等待屏幕不起作用

CSS

#loading {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    opacity: 0.75;
    background-color: #ffffff;
    -webkit-transition: all .5s ease;
    z-index: 3000;
    display:none;
    vertical-align: middle;
    text-align: center;
  }
  #loading-img {
    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid #297bda;
    width: 50px;
    height: 50px;
    margin: auto;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%,-50%);
    padding: 2rem;
  }

HTML

<div id="loading">
  <div id="loading-img"></div>
</div>

Javascript

$('#compare').click(function() {
//just the relevant part

  $('#loading').show();
....
});

我调用

$('#loading').hide();

在.done(函数(数据)中。

正如我所说，代码已执行，但加载屏幕仅在第一次加载。事实上，在尝试解析加载 div 时，我第二次收到 null 。 我也尝试过

       document.getElementById("loading").style.visibility = "hidden";
       document.getElementById("loading").style.display = "none";

不使用 hide() 但结果相同。

有什么想法吗？

Answer 1

找到了!几个小时后，这是我的愚蠢错误。 我得到了这个

<div id="finalresults">
<div>

<div id="loading">
  <div id="loading-img"></div>
</div>

并且正在做 document.getElementById("最终结果").innerHTML = ""; 在ajax调用期间，所以我删除了加载div，因为我忘记了前一个div中的/

谢谢大家，对错误深表歉意