jQuery $.getJSON 和遍历数组正在倾尽全力

Posted 2023-03-14

【中文标题】jQuery $.getJSON 和遍历数组正在倾尽全力

【英文标题】：jQuery $.getJSON and looping through array is dumping all out

【发布时间】：2015-07-01 10:16:10

【问题描述】：

这是我当前的 JS 代码：

$(function()
$.getJSON("/get_slideshow_messages",
    function(data)
        setInterval(function()
            $.each(data, function(i, item) 
                console.log(item.message);
            );
        , 5000);
    
);
);

我正在制作一个简单的幻灯片，对 url 的调用以以下形式返回一个 Laravel 雄辩的对象：

return SlideshowMessages::all();

如果我控制台记录“数据”，则返回：

Object, Object, Object]
 0: 
     Objectcreated_at: null
     id: "1"
     message: "test1"
     updated_at: null
     __proto__: Object
 1: Object
 2: Object
  length: 3

如何正确循环遍历数组，以便每次只收到一项？

【问题讨论】：

您尝试使用 $.each 的循环是否有任何问题？

【参考方案1】：

您需要保留一个每次调用间隔时都会更改的计数器，而不是使用 each。我没有测试过这个，因为我没有你的数据集——但理论上这应该可行。

$(function()
$.getJSON("/get_slideshow_messages",
    function(data)
        var currentSlide = 0;
        var nextSlide = function () 
                //Loop back around
                if (!data[currentSlide]) currentSlide = 0;
                console.log(data[currentSlide].message);

                //Increase our counter
                currentSlide++;
        ; 

        //render the first slide straight away
        nextSlide();

        //Set up our interval to render them every 5 seconds
        setInterval(nextSlide, 5000);
    
);
);

【讨论】：

关闭 - 您只需在第一次立即调用该函数，否则当页面加载时它将等待 5 秒才能显示第一张幻灯片。