在一定时间后更改加载微调器的内容而不刷新页面

时间:2019-01-22 17:21:55

标签: jquery ajax settimeout

我有一个正在加载AJAX调用的微调器。因此,我想在10秒后更改显示文本,以告诉用户“请稍候,仍在处理中……”。用户从下拉列表中更改公司名称。

function showAjaxLoader() {
  if ($('#loader').length <= 0) {
    $('body').append('<div style="display:none;"><div id="loader" class="stepLoader"><p>Loading...</p></div></div>');
    setTimeout(function() {
      $('#loader p').replaceWith('<span style="font-size:12px; font-weight:bold;">Please wait, still processing...<span>');
    }, 10000);
  } else {
    $('#loader .spinner').remove();
  }
}

此解决方案工作正常。但是,当用户更改公司名称时,加载程序仍显示“请稍候,仍在处理...”消息。它应该显示“正在加载...”消息。我正在调用此函数;

 beforeSend: showAjaxLoader(),

任何建议将不胜感激。

1 个答案:

答案 0 :(得分:0)

作为一个选项,您可能希望完全从DOM中删除加载程序。我希望您也可以使用hideAjaxLoader的方法$('#loader').remove()

或者如果您同时使用showAjaxLoader进行两次操作,则最好将其重命名为toggleAjaxLoader并在else中进行完全清理,因此您可以使用{ {1}}

一个侧面的建议是,如果数据早于10秒到达,则清除超时将是一个好习惯。