基于URL哈希触发jQuery标签点击事件失败求助

嘿，我来帮你搞定这个小问题～你遇到的情况其实很常见，主要是因为直接模拟click事件的时候，Bootstrap的Tab组件可能还没完全初始化好，导致事件没被正确触发。咱们换个更可靠的方式来实现：

修改后的代码 #

jQuery部分 #

// 点击标签时设置哈希值
$("#nav-page_requests-tab").click(function() { 
  window.location.hash = '2'; 
});

$(document).ready(function() {
  // 把哈希值的获取放到DOM就绪后，确保时机正确
  var currentValue = window.location.hash.substr(1);
  if(currentValue === '2'){
    // 用Bootstrap官方的Tab激活方法，比模拟click更稳定
    $("#nav-page_requests-tab").tab('show');
  }
});

HTML部分（保持你的原有代码即可） #

<a class="nav-item nav-link" id="nav-page_requests-tab" data-toggle="tab" href="#nav-page_requests" role="tab" aria-controls="nav-page_requests" aria-selected="false">Page Requests</a>

为什么原来的代码没效果？ #

你之前的写法里，currentValue是在document.ready外面定义的，虽然能拿到哈希值，但更关键的是：当document.ready执行时，Bootstrap的Tab组件可能还没完成事件绑定，这时候调用.click()模拟点击，其实没有触发Bootstrap内部的标签切换逻辑。而用.tab('show')是直接调用Bootstrap提供的API来激活标签，这是官方推荐的方式，能确保触发所有必要的组件行为。

另外要注意，确保你的页面已经正确引入了Bootstrap的JavaScript文件（和jQuery一起，因为Bootstrap依赖jQuery），不然.tab()方法会失效哦～

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