Ajax请求中的async属性

前端之家收集整理的这篇文章主要介绍了Ajax请求中的async属性前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

async属性

  • 类型:Boolean
  • 默认值: true。默认设置下,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为 false。

注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。

使用案例

$(document).on("click",".add",function(){
    var before_num = Number($("#number").val());
    var after_num = berfore_num + 1;
    $.ajax({
        url: "/add",method: "get",dataType: "json",success: function(result) {
            $("#number").val(after_num);
            conlose.log(result);
        }
    })
});

问题

  • 当连续点击时,会出现number增加的值和你点击次数不相符。

ajax默认是异步的请求。当请求"/add"还未执行完成,就可能已经执行下一次请求,导致before_num不是上一次请求后的值。

解决

  • 将async置为false,用同步请求将浏览器锁住,保证before_num是上一次请求的值。

猜你在找的Ajax相关文章