使用 javascript 和 jquery 回调答案

【问题标题】：Callback with javascript and jquery使用 javascript 和 jquery 回调
【发布时间】：2014-03-06 13:08:41
【问题描述】：

我更像是一名 Java 开发人员，并且在处理 javascript 回调时遇到了困难。我想知道这里是否有专家可以帮助我摆脱与此代码的斗争。

我正在尝试从 db 中提取我们的位置并填充到一个数组中。在第一次加载时，我试图刷新所有位置，但我无法控制执行流程和加载值。下面是代码，我把输出放在最后。

JQUERY 代码：

         // load all locations on first load.
            refreshLocations();
            $("#locInput").autocomplete({source: locationData});
             }); // end of document.ready

            // function to refresh all locations.
             function refreshLocations() {
                 getLocationArray(function(){
                     console.log("firing after getting location array");
                  });
              }
            // function to get the required array of locations.
            function getLocationArray() {
               getJsonValues("GET", "getLocalityData.php", "", getLocalityFromJson);
            }

            // function to pick up localities from json.
            function getLocalityFromJson(json){
                if (!json) {
                    console.log("====> JSON IS NOT DEFINED !! <====");
                    return;
                } else {
                    console.log("json is defined so processing...");
                    var i = 0;
                    $.each(json.listinginfo, function() {
                    var loc = json.listinginfo[i].locality;
                            locationArray[i] = loc;
                            console.log("added location ->" + locationArray[i]);
                            i++;
                    });
                }
                //return locationArray;
            }

            // function to get raw json from db.
            function getJsonValues(type, url, query, getLocalityFromJson) {
                    var json;
                    // if the previous request is still pending abort.
                    if (req !== null)
                        req.abort();
                    var searchString = "";
                    if (query !== "") {
                        searchString = "searchStr" + query;
                    }       

                    console.log("searchString : (" + query + ")");
                    req = $.ajax({
                    type: type,
                            url: url,
                            data: searchString,
                            contentType: "application/json; charset=utf-8",
                            dataType: "text",
                            success: function(result) {
                            json = JSON.parse(result);
                                    console.log("========start of json 
                                                             return============");
                                    console.log(JSON.stringify(json));
                                    console.log("========end of json
                                                               return============");
                                    //return json;
                            }
                    });
                    getLocalityFromJson(json);
                    return json;
            }

以上代码输出如下：

     searchString : () (18:25:36:473)
     at locality1.php:74
     ====> JSON IS NOT DEFINED !! <==== (18:25:36:518)
     at locality1.php:48
     ========start of json return============ (18:25:37:606)
     at locality1.php:83
     {"listinginfo":[{"listing":"1","locality":"birmingham"},       
     {"listing":"2","locality":"oxford"}]} (18:25:37:624)
     at locality1.php:84
      ========end of json return============ (18:25:37:642)
     at locality1.php:85
      >

我们将不胜感激。

【问题讨论】：

标签： javascript php jquery callback

【解决方案1】：

在你的成功回调中调用getLocalityFromJson(json);

function getJsonValues(type, url, query, getLocalityFromJson) {
    var json;
    // if the previous request is still pending abort.
    if (req !== null)
        req.abort();
    var searchString = "";
    if (query !== "") {
        searchString = "searchStr" + query;
    }       

    console.log("searchString : (" + query + ")");
    req = $.ajax({
        type: type,
        url: url,
        data: searchString,
        contentType: "application/json; charset=utf-8",
        dataType: "text",
        success: function(result) {
            json = JSON.parse(result);
            console.log("========start of json return============");
            console.log(JSON.stringify(json));
            console.log("========end of json return============");
            //return json;
            getLocalityFromJson(json);
        }
    });
}

【讨论】：

完成了，但 refreshLocations 中的函数不打印控制台日志。所有回调的语法都好吗？还是需要修改？
另外请告诉我哪个是最好的调试器，我可以用它来调试 netbeans 中的 js？
因为refreshLocations中的函数永远不会被调用。

【解决方案2】：

您需要调用 getLocalityFromJson(json) 并在您的 ajax 成功函数中返回 json。 Ajax 请求是异步的，不能保证在您到达 getLocalityFromJson(json); 行时请求将完成。返回（json）；他们目前在哪里。

【讨论】：

【解决方案3】：

来自jquery ajax 调用的回调函数完成、失败、成功等。请求成功后调用success，如果出现错误 500、404 或 w/e 之类的错误，则会调用失败。 Complete 总是在 ajax 调用之后调用。

如果您希望您的代码只遵循 java 中的顺序，请将 async: false 扔到您的 ajax 调用中。但我不建议这样做，因为它违背了使用此方法的目的，并且还会锁定您的浏览器。

在继续之前，您应该确保等待请求完成 - 因此将代码放入您想要在请求完成获取数据后运行的成功函数中。

【讨论】：

【解决方案4】：

我认为您需要记住 Ajax 正在异步运行，因此您需要按照此线程执行刷新。

【讨论】：