如何用JavaScript多次访问不同参数页面？解决仅打开最后页面问题

嘿，我来帮你拆解下问题所在，以及对应的解决办法～

首先，你的代码里有个小拼写错误：codes.lenght应该是codes.length，而且循环条件要写成i < codes.length（数组索引从0开始，用<=会多跑一次，最后访问codes[codes.length]也就是undefined），不过这不是导致只跳转到最后一个页面的核心原因。

核心问题分析 #

你用了window.open(..., '_self')，这个参数会让浏览器直接替换当前页面。当同步循环快速执行时，浏览器还没来得及完成前一次跳转，就已经收到了后续的跳转指令，最终只会执行最后一次的跳转请求；更糟的是，一旦第一次跳转执行，当前页面的脚本就会停止运行，剩下的循环代码根本没机会执行。

你之前尝试的setTimeout没生效，大概率是因为没处理好变量作用域的问题——如果用var声明i，所有定时器的回调都会共享同一个i变量，当定时器触发时，i已经变成了数组的长度值，自然只会访问最后一个元素（甚至是undefined）。

解决方案 #

根据你的需求，分两种情况给出方案：

1. 允许在新标签页打开每个页面（最简单的方案）

把_self改成带唯一标识的窗口名，同时用let声明循环变量i（绑定块级作用域，避免共享变量问题）：

var codes = [1, 2, 3, 4, 5];
for(let i = 0; i < codes.length; i++){ 
    // 用不同的窗口名确保每个页面都能打开
    window.open(`http://localhost/applicationame/execute/cod/${codes[i]}`, `page-${i}`); 
}

2. 必须在同一个标签页依次访问页面

这种情况需要等待前一个页面加载完成后，再触发下一次跳转，我们可以用递归函数来实现：

var codes = [1, 2, 3, 4, 5];
let currentIndex = 0;

function visitNextPage() {
    // 所有页面都访问完就停止
    if (currentIndex >= codes.length) return;
    
    const targetUrl = `http://localhost/applicationame/execute/cod/${codes[currentIndex]}`;
    currentIndex++;
    
    // 监听当前页面加载完成后，再触发下一次跳转
    window.addEventListener('load', function onPageLoaded() {
        // 移除监听避免重复触发
        window.removeEventListener('load', onPageLoaded);
        // 可以加个延迟，给页面加载留缓冲时间
        setTimeout(visitNextPage, 1000);
    });
    
    // 跳转到目标页面
    window.location.href = targetUrl;
}

// 启动访问流程
visitNextPage();

补充：如果一定要用setTimeout（仅适合新标签页场景）

如果坚持用setTimeout，记得用let声明i来绑定每个循环的变量，或者用立即执行函数创建闭包：

var codes = [1, 2, 3, 4, 5];
for(let i = 0; i < codes.length; i++){ 
    setTimeout(() => {
        window.open(`http://localhost/applicationame/execute/cod/${codes[i]}`, `page-${i}`);
    }, 1000 * i); // 每个请求间隔1秒
}

注意：这种方式如果用_self，第一个跳转后当前页面脚本就会终止，后续定时器不会执行，所以只适合新标签页的场景。

内容的提问来源于stack exchange，提问作者Lucas Oliveira