Javascript Jquery$。每个内部$。每个使用setTimout

我试图在嵌套的

$中使用
setTimeout（）
。每个
。当我运行此脚本时，
console.log
立即显示
main0、main1、main2
，这是错误的，应该在每5秒后逐个显示，如
test…
第二个
$的值。每个

var i = 1;
var indexArrayMain = [1,2,3];
var indexArray = [3,6,9];
var timerx = new Array();

// main each
$(indexArrayMain).each(function(indexArrayMain) {
  console.log('main' + indexArrayMain);
  // sub each
  $(indexArray).each(function(indexArraykey) {
    function internalCallback(i, indexArraykey) {
      return function() {
        val = indexArray[indexArraykey];
        console.log("test " + i + val);
      }
    } 

    timerx[i] = setTimeout(internalCallback(i, indexArraykey), i * 5000);                     
    i++;
  }); 
}); 

您有
console.log（'main'+indexArrayMain）
它写在第一个
$下。每个
，此日志都没有在超时回调内运行，这使它立即运行
 您需要等待超时结束，然后在阵列上运行下一项

试试这个：


var indexArrayMain=[1,2,3]；
var indexArray=[3,6,9]；
var head=arr=>arr[0]
var tail=arr=>arr.slice（1）
功能日志（主、内部、i）{
if（main.length==0 | | internal.length==0）返回console.log（'end'）；
console.log（'main-'.concat（head（main）））
console.log（'inner-'.concat（head（inner）））
设置超时（日志，i*5000，尾部（主），尾部（内部），i++）
}
log（indexArrayMain，indexArray，1）
setTimeout函数创建一个新的执行周期。要解决这个问题，您应该了解javascript事件循环和并发模型。
为了避免嵌套循环的需要，并保持多个选项处于打开状态（以及为了更容易测试结果），可以事先展平数组。如果设置正确（indexArrayMain的值似乎没有被使用？），例如：


设i=1，indexArrayMain=[1,2,3]，
indexArray=[3,6,9]，
arr=indexArrayMain.reduce（（a，el，ind）=>{a.push（'main'+ind）；a.push（…indexArray.map（ind2=>'test'+i+++ind2））；返回a；}，[]）；
//imho在展平阵列上使用setInterval会更干净，但使用相同的setTimeout方法：
arr.forEach（功能（el，ind）{
setTimeout（console.log.bind（null，el），ind*5000）；
});
console.log立即显示main0、main1、main2

这是因为您正在立即打印这些值：

$(indexArrayMain).each(function(indexArrayMain) {
    console.log('main' + indexArrayMain);

    // other, unrelated code
});

代码中没有引起延迟的内容，它只是在集合上循环并将值记录到控制台

应在每5秒后逐个显示

然后需要使用类似于
setTimeout
的方法引入延迟。如果您希望它是“每5秒”，那么听起来它应该是集合的索引加上1乘以5秒。比如说：

$(indexArrayMain).each(function(indexArrayMain) {
    setTimeout(function () {
        console.log('main' + indexArrayMain);
    }, (indexArrayMain + 1) * 5000);

    // other, unrelated code
});

请注意，这将独立于您的其他超时，并且不能保证它们之间的时间精确。如果您希望它们总是以相同的顺序执行，那么您可能希望使用相同的超时，而不是单独的超时，或者可能需要重新考虑您尝试执行的操作的结构。（这还不完全清楚，目前您所做的只是登录到控制台，因此顺序并不重要。）
但是您对第一个console.log没有超时，您只需循环indexArrayMain，然后立即调用console.log。如果您希望在超时回调中出现“main”输出，这行代码不应该在回调函数中吗？使用调试器并逐步完成代码，您将看到代码是如何执行的，并且可能有助于理解执行流程。如果你还没有使用Chrome开发者工具，这是一个很好的开始。是的，但我需要这样：main0-开始脚本测试13-5秒后测试26-10秒后测试39-20秒后main1-25秒后。。。所以，显示main1，main2必须依赖于setTimeout中使用的时间（每秒钟一次），我分叉了你的小提琴，并为第一个$.each添加了一个setTimeout调用。看看这是不是你想要的：谢谢，但这不是我想要的。我需要显示：Main0，inner0，inner2，inner3，Main1，inner1，inner2，inner3。等