Question

我正在尝试在我的ajax调用运行时显示加载图像，但是使用beforeSend属性不会更改我的结果区域。

$.ajax({
  url: "/answer_checker.php",
  global: false, type: "POST", 
  data: ({...clipped...}), 
  cache: false,
  beforeSend: function() {
    $('#response').text('Loading...');
  },
  success: function(html) {
    $('#response').html(html);
  }
}

提前致谢。

Answer 1

我有类似的问题。为了解决我的问题，我用.html替换了beforeSend部分中的.text，并创建了一个html标记，以插入到保存我状态的元素中。成功函数没有替换.text（）函数创建的内容，但它确实替换了.html（）函数创建的内容。

$.ajax({
  url: "/answer_checker.php",
  global: false, type: "POST", 
  data: ({...clipped...}), 
  cache: false,
  beforeSend: function() {
    $('#response').html("<img src='/images/loading.gif' />");
  },
  success: function(html) {
    $('#response').html(html);
  }
}

Answer 2

我有一个解决方案，它可能不是最好的方法，但它在这种情况下有效。

$('input').keyup(function () {

  $('#response').text('loading...');

  $.ajax({
    url: "/answer_checker.php",
    global: false, type: "POST", 
    data: ({...clipped...}), 
    cache: false,
    success: function(html) {
      $('#response').html(html);
    }
  });
});

通过在调用ajax函数之前设置共振内容，它会一直显示加载文本，直到ajax调用更新相同的内容。

感谢所有花时间回答的人。

艾伦

Answer 3

您在cache: false

之后缺少逗号

Answer 4

您还可以使用以下内容：

$('#tblLoading').ajaxStart(function() { $(this).show(); });
$('#tblLoading').ajaxComplete(function() { $(this).hide(); });

在jQuery ajax运行时加载gif图像

4 个答案: