HTA内嵌HTML链接二次点击无法加载文件问题求助

我来帮你分析问题根源，然后给出可行的解决方案：

问题核心 #

你的代码只在首次加载页面时绑定了一次链接的点击事件，当点击链接加载新HTML内容后，新页面里的导航链接并没有被重新绑定点击逻辑。这时候点击这些新链接，浏览器会尝试按照原始的href（比如/third）去跳转，而不是执行你的自定义加载逻辑，所以会出现找不到文件的错误（系统把/third当成了磁盘路径的一部分）。另外，你原来依赖#!前缀阻止跳转的逻辑，在新页面的链接上并不生效，也会导致路径提取出错。

解决方案 #

我们需要把链接事件绑定的逻辑封装成独立函数，每次加载新页面后都重新调用它，同时优化路径提取和跳转阻止的逻辑：

修改my_js_file.js的代码如下：

function getFileContent(filePath) {
    var fileStream = new ActiveXObject('ADODB.Stream');
    fileStream.Type = 2;
    fileStream.Charset = 'utf-8';
    fileStream.Open();
    fileStream.loadFromFile(filePath);
    var fileContent = fileStream.ReadText();
    fileStream.Close();
    return fileContent;
}

// 封装链接事件绑定逻辑，每次加载新页面后都要调用
function bindPageLinks() {
    var pageLinks = document.querySelectorAll('a');
    for(var i = 0; i < pageLinks.length; i++) {
        pageLinks[i].onclick = function(e) {
            // 直接阻止链接的默认跳转行为，无需修改href属性
            if (e) {
                e.preventDefault();
            } else {
                // 兼容IE的事件处理方式
                window.event.returnValue = false;
            }
            
            // 提取页面名称：去掉href开头的斜杠，处理根路径的情况
            var page = this.getAttribute('href').replace(/^\//, '');
            if (page === '') {
                page = 'index';
            }
            
            // 加载对应页面内容
            document.body.innerHTML = getFileContent(page + '.html');
            // 新页面加载完成后，重新绑定所有链接的点击事件
            bindPageLinks();
        }
    }
}

// 初始化：加载首页并绑定链接事件
document.body.innerHTML = getFileContent('index.html');
bindPageLinks();

关键改进点 #

1. 事件重新绑定：每次加载新页面后调用bindPageLinks()，确保新页面里的导航链接都能触发自定义加载逻辑。
2. 可靠的跳转阻止：直接通过preventDefault()（兼容IE的window.event.returnValue = false）阻止链接默认跳转，不需要修改href属性，避免路径混淆。
3. 正确的路径提取：用正则表达式去掉href开头的斜杠，不管是/、/second还是/third，都能正确提取页面名称，拼接成index.html、second.html等正确文件名。

额外注意事项 #

• 确保index.html、second.html、third.html和你的HTA、JS文件在同一个目录下，这样getFileContent才能正确读取文件。
• 本地运行HTA时默认拥有ADODB.Stream的文件读取权限，无需额外设置；如果从网络共享位置运行，可能需要调整安全权限。

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