带参数的URI片段为何阻止文档就绪？

这种情况并非文档就绪事件（$(function())）没有触发，而是你的myFunction内部逻辑或执行异常导致的表象问题。以下是具体原因和排查方案：

核心原因 #

浏览器URI片段（哈希）带=符号本身不会影响jQuery的文档就绪事件触发，问题大概率出在以下两点：

1. myFunction内部哈希解析逻辑出错 #

如果myFunction包含处理URL哈希的代码，可能只适配了不带参数的哈希格式（比如#anything），遇到带=的哈希（#anything=1）时解析失败，导致函数抛出错误中断执行。

常见错误示例：

function myFunction() {
  // 错误逻辑：仅处理纯字符串哈希，未考虑带参数场景
  const hashValue = location.hash.slice(1);
  if (hashValue.includes('=')) {
    // 未处理该情况，直接抛出错误或终止执行
    throw new Error('不支持带参数的哈希');
  }
  // 后续业务逻辑...
}

这种场景下函数会直接报错，控制台会输出错误信息，但表面看起来像是函数没被调用。

2. 存在未捕获的执行错误 #

如果myFunction依赖的资源（如未加载的脚本、不存在的DOM元素）在哈希带参数的场景下出现问题，会抛出未捕获错误，导致函数执行中断。

排查与修复步骤 #

1. 验证文档就绪事件是否触发
   在脚本中添加日志，确认无论哪种URL格式，事件都会执行：

<script>
$(function () 
{
    console.log('文档就绪事件已触发'); // 新增日志
    myFunction();
});
</script>

打开浏览器开发者工具（F12）的Console面板，刷新带#anything=1的页面，若能看到该日志，说明事件正常触发，问题在myFunction内部。

2. 查看控制台错误信息
   刷新页面后检查Console面板的报错，根据提示定位myFunction中的问题代码（如变量未定义、解析逻辑错误）。

3. 修复哈希解析逻辑
   如果是哈希解析问题，改用通用方法处理带参数的哈希：

function myFunction() {
    const hashStr = location.hash.slice(1);
    if (hashStr) {
        // 使用URLSearchParams解析哈希参数
        const hashParams = new URLSearchParams(hashStr);
        const anything = hashParams.get('anything');
        console.log('获取到的参数值:', anything); // 输出1
        // 后续业务逻辑...
    }
}

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