js函数调用另一个函数A，A中有一个ajax请求，但是不是ajax不执行

先上部分代码，点击按钮后根据在浏览器器调试，最后执行顺序如代码中的注释顺序
 $(function () {
    $("#btnsure").on('click', function () {
      var deviceinfo = getdeviceinfo();
       debugger; //第三步，getdeviceinfo()方法调用完，返回的值为空
     })
})
function getdeviceinfo() {
             debugger;//第一步，断点先执行到这里，第二步直接就跳过ajax请求
            var deviceinfo = { Model: "", Build: "", sysVersion: "", OS: "", fing: "", city: "" };
            //获取当前城市信息
            $.ajax({
                url: 'https://api.map.baidu.com/location/ip?ak=VV??????????????&coor=bd09ll',
                type: 'POST',
                dataType: 'jsonp',
                timeout: 2000,
                async: false,
                success: function (json) {
                    debugger; //，第四步，在前面onclick的事件执行完之后才中这个断点，正确返回了需要的数据
                    deviceinfo.city = json.content.address;
                    //此处省略其他代码
                },
                error: function (e) {
                    layer.open({ content: '错误！请刷新！', skin: 'msg', time: 2 })
                },
                complete: function (XMLHttpRequest, status) {
                    if (status == 'timeout') {
                        layer.open({ content: '网络不稳定，请求超时！', skin: 'msg', time: 2 })
                    }
                }
            })
           debugger;//第二步，跳过了ajax请求
               return deviceinfo;
        }
所以，这是为什么呢，为什么不能调用了方法结果却不能执行请求返回数据

解决方案 »

  1.   

    先网上查了半天，发现这种情况比较少，综合来看两个方面的问题，1是ajax同步异步请求的问题，于是我把异步关闭了，
    2 是没有成功加载jquery库，但是如果jquery没有成功加载，那么$(function(){})又怎么会起作用呢，按钮的点击事件也应该不能响应啊，既然执行到了onclick事件里面，那么jquery库应该是执行成功了的，
    所以，还有什么原因吗
      

  2.   

    jQuery不会阻塞后面的语句运行，ajax需要一定的时间，数据还没返回，已经执行下一条语句了，当然得不到返回值。如果一定要获取返回的数据，只能使用回调函数，在success里获取。是否与这个有关系？
      

  3.   


    $(function () {
        $("#btnsure").on('click', async function () {
          var deviceinfo = await getdeviceinfo();
           debugger; //第三步，getdeviceinfo()方法调用完，返回的值为空
         })
    })
    function getdeviceinfo() {
        retrun new Promise((rs,rj) => {
                 debugger;//第一步，断点先执行到这里，第二步直接就跳过ajax请求
                var deviceinfo = { Model: "", Build: "", sysVersion: "", OS: "", fing: "", city: "" };
                //获取当前城市信息
                $.ajax({
                    url: 'https://api.map.baidu.com/location/ip?ak=VV??????????????&coor=bd09ll',
                    type: 'POST',
                    dataType: 'jsonp',
                    timeout: 2000,
                    async: false,
                    success: function (json) {
                        rs(json)
                        debugger; //，第四步，在前面onclick的事件执行完之后才中这个断点，正确返回了需要的数据
                        deviceinfo.city = json.content.address;
                        //此处省略其他代码
                    },
                    error: function (e) {
                        layer.open({ content: '错误！请刷新！', skin: 'msg', time: 2 })
                    },
                    complete: function (XMLHttpRequest, status) {
                        if (status == 'timeout') {
                            layer.open({ content: '网络不稳定，请求超时！', skin: 'msg', time: 2 })
                        }
                    }
                })
               debugger;//第二步，跳过了ajax请求
               return deviceinfo;
        })
    }
      

  4.   

    借用3楼的代码，$(function () {
        $("#btnsure").on('click', async function () {
          var deviceinfo = await getdeviceinfo();
           debugger; //第三步，getdeviceinfo()方法调用完，返回的值为空
         })
    })
    function getdeviceinfo() {
        return new Promise((rs,rj) => {
                 debugger;//第一步，断点先执行到这里，第二步直接就跳过ajax请求
                var deviceinfo = { Model: "", Build: "", sysVersion: "", OS: "", fing: "", city: "" };
                //获取当前城市信息
                $.ajax({
                    url: 'https://api.map.baidu.com/location/ip?ak=VV??????????????&coor=bd09ll',
                    type: 'POST',
                    dataType: 'jsonp',
                    timeout: 2000,
                    async: false,
                    success: function (json) {
                        debugger; //，第四步，在前面onclick的事件执行完之后才中这个断点，正确返回了需要的数据
                        deviceinfo.city = json.content.address;
                        //此处省略其他代码
                          rs(deviceinfo)  //此处传什么  await接收到的就是什么
                    },
                    error: function (e) {
                        layer.open({ content: '错误！请刷新！', skin: 'msg', time: 2 })
                    },
                    complete: function (XMLHttpRequest, status) {
                        if (status == 'timeout') {
                            layer.open({ content: '网络不稳定，请求超时！', skin: 'msg', time: 2 })
                        }
                    }
                })
               debugger;//第二步，跳过了ajax请求
               // return deviceinfo;  不需要return
        })
    }
      

  5.   

    照你这样改了之后倒是可以完成需求，但是就是这个方法几个地方需要使用，这样改了每次用就得再写一次，想着这样写成一个function在js文件里面可以方便调用，结果会跳过
      

  6.   

    对于三楼四楼的回复，对于我而言倒是新的东西了，没有这样使用过，不太会await的用法，await后面是不是得跟Promise才可以啊？
    另外 var deviceinfo = await getdeviceinfo();这样直接使用会报错，提示"必须是;"也就是await后面不能跟函数？
      

  7.   

    不是说不能是函数；函数要返回一个promise,这样的话await才会去等promise中成功或者失败的回调传过来的参数；如果函数不返回一个promise，await也就没有意义了，直接取函数返回的结果就可以了；仔细检查一下，应该是别的地方出错了
      

  8.   

    照你这样改了之后倒是可以完成需求，但是就是这个方法几个地方需要使用，这样改了每次用就得再写一次，想着这样写成一个function在js文件里面可以方便调用，结果会跳过我看你并没有带参数，说明每次调用都是执行相同的操作，那么能不能把click事件的后续操作，交给回调函数来做呢？在回搞函数里判断是谁click了，该执行什么样的操作