zoukankan      html  css  js  c++  java
  • js中ajax的异步性

    最近项目里遇到ajax异步性的问题,简化后的代码如下:

    function ajaxGetEvents(calendarView, time) {
        var year = time.getFullYear();
        var month = time.getMonth() + 1 < 10 ? "0" + (time.getMonth() + 1) : time.getMonth() + 1;
        var day = time.getDate() < 10 ? "0" + time.getDate() : time.getDate();
        var timeStr = year + "-" + month + "-" + day;
        var ajaxData = {
            search_monthNum : timeStr;
        };
        var ajaxUrl = localStorage.getItem("globalUrl") + 'trip/sheduleInfo!monthList.action';
        var eventsData;
        $.ajax( {
            type : 'post',
            dataType : 'json',
            url : ajaxUrl,
            data : ajaxData,
            async: false,//此处设置ajax为同步请求
            success : function(data) {
                if (data.retCode == '1') {
                    eventsData = data.returnData;
                } else {
                    console.log(data.message);
                }
            },
            error : function() {
                console.log('ajax error in calendar.js');
            }
        });
        return eventsData;
    }

    这个函数试图将ajax获取到的数据存储到eventsData中,然后返回。

    这里主要要注意的是注释处,如果不将这个请求设为同步请求的话,这个返回的数据永远都会是空的。

    异步的ajax是非阻塞的,success回调函数只在数据返回后才开始执行,而在此之前,程序会继续运行,执行return语句,那么被返回的eventsData永远是空的。

    而同步请求是阻塞的,将这个函数中的请求设为同步则可以解决问题,代价是执行这个函数时可能会需要等待一段时间,时间的长短自然是看响应的速度了。

    此外,类似的还有html5中的定位方法geolocation,看下面代码:

    $(function(){
        var lat, lng;
        getCurrPosition();
        $('#position').html("lat = " + lat + '  lng = ' + lng);
    
        function getCurrPosition(){
            if(navigator.geolocation){
                navigator.geolocation.getCurrentPosition(getPositionSuccess, getPositionError);
            }else{
                alert("您的浏览器不支持Geolocation!");
            }
        }
        function getPositionSuccess(position) {
            lat = position.coords.latitude;
            lng = position.coords.longitude; 
        }
        function getPositionError(error){
            switch (error.code) {
                case error.TIMEOUT:
                    alert("连接超时,请重试");
                    break;
                case error.PERMISSION_DENIED:
                    alert("您拒绝了使用位置共享服务,查询已取消");
                    break;
                case error.POSITION_UNAVAILABLE:
                    alert("位置信息不可用");
                    break;
            }
        }
    });

    geolocation中的getCurrentPosition和watchPosition也都是异步的方法,像这个程序试图显示坐标信息的做法也是不可行的,lat和lng会一直为空。

    而这里就没办法像ajax一样设为同步了,可行的做法应该是将进行显示的语句$("#position").html()放在getPositionSuccess函数中。

  • 相关阅读:
    python while 格式化 运算符 编码
    python 变量 if
    1、cad安装
    10、云存储—文件上传
    9、云函数
    8、云数据库
    8、小程序云开发
    7、页面交互js
    6、页面样式WXSS
    5、页面结构WXML
  • 原文地址:https://www.cnblogs.com/caiminfeng/p/4706056.html
Copyright © 2011-2022 走看看