-2

嗨,我有 json 数组,我想每 5 秒显示下一个值

此代码从服务器获取 json 并将 json 数组发送到函数:

function myFunction() {
        $.ajax({
            type: "POST",
            url: "ws.aspx/GetQueue",
            data: "{'eventid':'" + eventID + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {
                if (msg != null) {
                    var obj;
                    if (msg.hasOwnProperty("d"))
                        obj = jQuery.parseJSON(msg.d);
                    else
                        obj = jQuery.parseJSON(msg);

                    setHtml(obj);
                }

                setTimeout(function () { myFunction(); }, 5000);
            },
            error: function (xhr, ajaxOptions, thrownError) {
                alert(xhr.responseText);

                setTimeout(function () { myFunction(); }, 5000);
            }
        });
    }

这是我将数组发送给它后的函数:

function setHtml(obj) {
        for (var i = 0; i < obj.length; i++)
            setTimeout(function () {  $('.Summary').html("<H1>" + obj[i].QueueName + "->" + obj[i].name + ' : ' + obj[i].Queue + "</H1><br/>"); }, 5000);
    }

但是循环内的值是未定义的,这是为什么呢?这个问题的解决方案是什么?

4

5 回答 5

1

在匿名函数内移动循环:

function setHtml(obj) {        
    setTimeout(function () {  
        for (var i = 0; i < obj.length; i++)
            $('.Summary').html("<H1>" + obj[i].QueueName + "->" + obj[i].name + ' : ' + obj[i].Queue + "</H1><br/>"); 
    }, 5000);
}

然后阅读有关 javascript 闭包的信息。在您的版本中, 的值i是离开外部函数 ( setHtml) 时的值,即obj.length.

于 2013-01-30T16:50:35.117 回答
1

这是因为 的值i将等于obj.lengthsetTimeout 运行时的值。

function setHtml(obj) {
    for (var i = 0; i < obj.length; i++) {
        (function(cObj){
            setTimeout(function () {  $('.Summary').html("<H1>" + cObj.QueueName + "->" + cObj.name + ' : ' + cObj.Queue + "</H1><br/>"); }, 5000);
        })(obj[i]);
    }
}
于 2013-01-30T16:52:04.067 回答
1

问题是当你的setTimeout函数被调用时, 的值i已经改变了。 i将永远是obj.length,而且obj[obj.length]永远是undefined。相反,使用Array.forEach()or$.each()来迭代你的数组:

function setHtml(obj) {
    $.each(obj, function(i, val) {
        setTimeout(function () {
            $('.Summary').html("<H1>" + val.QueueName + "->" + val.name + ' : ' + val.Queue + "</H1><br/>");
        }, 5000);
    });
}

这会将您的代码包装setTimeout在其自己的范围内,以便不会更改变量。

或者,将调用setTimeout放在它自己的函数中:

function setHtml(obj) {
    for (var i = 0; i < obj.length; i++) {
        setSummaryHtml(obj[i]);
    }
}
function setSummaryHtml(val) {
    setTimeout(function () {
        $('.Summary').html("<H1>" + val.QueueName + "->" + val.name + ' : ' + val.Queue + "</H1><br/>");
    }, 5000);
}
于 2013-01-30T16:57:09.920 回答
0

datatype:json已经不需要执行 JSON.parseJSON。通过将其设置为 datatype:json 它将返回一个 javascript 对象,因此

if (msg.hasOwnProperty("d"))
         obj = jQuery.parseJSON(msg.d);
 else
         obj = jQuery.parseJSON(msg);

只能是这个

if (msg.hasOwnProperty("d"))
         obj = msg.d;
 else
         obj = msg;

您还需要关闭在 setTimeout 函数中循环

for (var i = 0; i < obj.length; i++) {
  (function (ii) {
    setTimeout(function () {
      $('.Summary').html("<H1>" + obj[ii].QueueName + "->" + obj[ii].name + ' : ' + obj[ii].Queue + "</H1><br/>");
    }, 5000);
  })(i);
}
于 2013-01-30T16:50:47.130 回答
0

谢谢,除了wirey用于处理循环内的json值之外,所有的都是答案。完整的答案是将元素添加到队列中,如下代码所示:

$.each(obj, function (i, val) {                                
                        $('.Summary').delay(5000).queue(function (n) {
                                str = "<H1>" + val.QueueName + "->" + val.name + ' : ' + val.Queue + "</H1><br/>";
                                console.log(str);
                                $(this).html(str);
                                n();
                            });
                    });
于 2013-01-31T07:15:46.453 回答