理解和使用 setInterval() 与 .each() 的麻烦

Question

我想在这里做什么：

我想用时间一一展示的元素很少。所以，我尝试使用以下代码：

/*Defining an object with selectors*/
var ticks_obj = {
    1: "#Pros1",
    2: "#Pros2",
    3: "#Pros3"
};

/*Using setinterval within loop with 1 sec gap*/
jQuery.each(ticks_obj, function(index, val){
       setInterval(function(){
            jQuery(val).show(500);
       }, 1000);
});

问题是：

.show() 在所有元素中同时发生。不一一列举了。

所以，我更改了代码并做了：

/*Object Definition here*/

/*Using loop within setinterval*/
jQuery.setInterval(function(){
       jQuery.each(ticks_obj, function(index, val){    
           jQuery(val).show(500);
       });
 }, 1000);

这显示没有结果。

我看不懂。谁能用几句话在要点中澄清一下？

另外，使用 jQuery 最简单的解决方案是什么？

Answer 1

使用

jQuery.each(ticks_obj, function(index, val){
       setTimeout(function(){
            jQuery(val).show(500);
       }, index * 1000);
});

Answer 2

你什么时候做的

jQuery.each(ticks_obj, function(index, val){
       setInterval(function(){
            jQuery(val).show(500);
       }, 1000);
});

它确实快速迭代了元素，并且每个相应的间隔在最后一个间隔的毫秒内执行。这就是它们同时显示的原因。

你真的不需要 setInterval，因为你可以像使用 .show() 那样传递 duration，并在每次迭代时递增 duration

var duration = 1500;
jQuery.each(ticks_obj, function(index, val){
      jQuery(val).show(duration);
      duration += 1500;
});

DEMO

理解和使用 setInterval() 与 .each() 的麻烦

Trouble in understanding and using setInterval() with .each()

jquery

timer

setinterval