我正在创建一个酒店页面,其中包含所有酒店的详细信息,包括其评论。对于酒店的评论,我想做分页。
在我的代码中,init()函数包含执行初始计算(如计算页数等)的所有代码。
如您所见,init()正在调用函数getReviewList,该函数将返回评论列表。在getReviewList()中,同步调用以接收评论列表(即reviewList.json)。
目标是一旦我收到评论列表,我就可以执行所有的计算。即使我使用setTimeout函数,这个操作也会延迟一段时间,同时,响应会存储在全局变量“reviewList”中。
但问题是,计算部分在响应存储在全局变量“reviewList”中之前执行。请告诉我哪里出错了。
Javascript(fiddle:http://jsfiddle.net/n28SS/)fiddle包含不完整的代码

     getReviewList: function () {
        var myReq, reqJSON,
            oThis = this;
        if(window.XMLHttpRequest) {
            myReq = new XMLHttpRequest();
        } else {
            myReq = new ActiveXObject("Microsoft.XMLHTTP");
        }
        myReq.open("GET", "reviewList.json", true);
        myReq.send();
        myReq.onreadystatechange = function() {
            if (myReq.readyState == 4) {
                if (myReq.status == 200) {
                    oThis.reviewList = JSON.parse(myReq.responseText);

                }
            }
        }
    },

    init: function() {
        var oThis = this,
            records;

        records = oThis.getReviewList();
        setTimeout(function () {

            records = oThis.reviewList.length;
        }, 1000);

        oThis.pages = Math.ceil(records / oThis.itemsPerPage);
        oThis.inited = true;
        oThis.attachEventListener();
    },

最佳答案

这不管用,因为

  setTimeout(function () {

        records = oThis.reviewList.length;
    }, 1000);

立即返回并执行记录=。。。1000毫秒后在后台操作。
以下行立即执行,因此无法访问records变量
oThis.pages=Math.ceil(records/...)
将在1秒后提供。您可以将所有代码移动到set timeout块中,或者最好使所有内容都异步:
 getReviewList: function (callback) {//pass the function that needs to act on list
    var myReq, reqJSON,
        oThis = this;
    if(window.XMLHttpRequest) {
        myReq = new XMLHttpRequest();
    } else {
        myReq = new ActiveXObject("Microsoft.XMLHTTP");
    }
    myReq.open("GET", "reviewList.json", true);
    myReq.send();
    myReq.onreadystatechange = function() {
        if (myReq.readyState == 4) {
            if (myReq.status == 200) {
                oThis.reviewList = JSON.parse(myReq.responseText);
                callback(oThis.reviewList);
            }
        }
    }
},

init: function() {
    var oThis = this,
        records;

    records = oThis.getReviewList(function (reviewList) { //Pass the function as a parameter

        records = reviewList.length;

    oThis.pages = Math.ceil(records / oThis.itemsPerPage);
    oThis.inited = true;
    oThis.attachEventListener();
    });


},

我没有测试代码,但它应该演示基本概念。

关于javascript - JavaScript中的同步调用不起作用,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/24502199/

10-11 12:48