避免同步ajax请求并显示加载

时间:2018-01-01 14:54:41

标签: javascript jquery ajax

如果从服务器收到响应并显示一些加载文本或gif,我怎样才能避免脚本进一步处理?

var employee = $.parseJSON(
    $.ajax({
        type: 'POST',
        url:  'get/employee/' + employee_id,
        dataType: "json", 
        async: false
    }).responseText
);
// Populate modal inputs with recieved data
$.each( employee, function( key, value ) {
    $( 'form[name="form-edit-employee"]' ).find('input[name="' + key + '"]').val( value ); 
});
$('#modal-edit-employee').modal('show');

完整代码可在this link上找到。

我希望在使用异步请求填充输入数据后显示模态,因为同步请求已在主线程上折旧并冻结浏览器窗口。

提前谢谢你!

1 个答案:

答案 0 :(得分:2)

绝不使用同步请求。使用回调正确使用异步模式,如下所示:

var $loadingIcon = $('#yourLoadingImage').show();
$.ajax({
  type: 'POST',
  url:  'get/employee/' + employee_id,
  dataType: "json", 
  success: function(employee) {
    $.each(employee, function(key, value) {
      $('form[name="form-edit-employee"]').find('input[name="' + key + '"]').val(value); 
    });
    $('#modal-edit-employee').modal('show');
    $loadingIcon.hide();
  }
})