jquery ajax($ .post)在处理请求时显示图标

Question

我正在使用jquery的$ .post来表示ajax(比如在不同的选择框中选择一个值来填充选择框).我使用了以下代码

$('#cmbState').change(function(){
 $.post('<?php echo APP_URL."include/ajax.php"; ?>', {stateid: $(this).val(), option: 'getCitiesList'}, function(response){
  if(response != '')
  {
   $('#cmbCity').html(response);
  }
 })
});

上面的代码完全正常,但它没有通知用户ajax请求正在进行中,他必须稍等一下.

我想在html控件旁边显示一个图像,该图像会一直显示,直到加载响应为止.

我只想要jquery的答案.在jquery docs上也找到了与此相关的东西($ .ajax)但是我想使用$ .post方法实现这个功能(如果可能的话).

请帮我解决一下这个.任何线索都非常感谢

谢谢

Answer 1

您可以使用ajaxStart和ajaxComplete全局Ajax事件在AJAX请求开始或完成时执行一段代码,例如:

// show the '#loading' element when ajaxStart, and hide it when ajaxComplete
$("#loading").bind("ajaxStart", function(){
  $(this).show();
}).bind("ajaxComplete", function(){
  $(this).hide();
});

通过这样做,您不需要添加任何逻辑来处理您所做的所有Ajax请求上的加载消息.

Answer 2

$.ajax({
    url:'/',
    data: params,
    type:'POST',
    beforeSend: function() {
        alert("loading")
    },
    success:function(html){ alert(html) }
}); 

将加载代码放在beforeSend函数中,该函数在success调用之前触发.