在 url 中使用 # 打开一个 html div 元素答案

【问题标题】：Opening an html div element using # in url在 url 中使用 # 打开一个 html div 元素
【发布时间】：2017-11-09 14:09:32
【问题描述】：

我有一个包含两个选项卡（主页|操作）的页面。

当我将鼠标悬停在“操作”选项卡上时，URL 会显示为 #tab_action ：

然后当我点击时，它会打开相关的标签内容：

当我手动输入网址时：

localhost:8088/hse/public/observation/3/show#tab_action

它打开的是主页选项卡而不是操作选项卡。

如何使上述 URL 打开操作选项卡，就像我单击操作选项卡时一样。

【问题讨论】：

onload 读取哈希
@epascarello 你能解释更多吗，我正在使用引导标签

标签： javascript jquery html css url

【解决方案1】：

onload/document ready 读取哈希值，如果存在就使用它。

$(function(){
  var hash = window.location.hash;
  if (hash && hash.length>1) {
    $(hash).click()
  }
})

【讨论】：

【解决方案2】：

在页面加载时检查 window.location.hash（网址哈希）并在 js 代码中切换标签。

【讨论】：

【解决方案3】：

你正在寻找WindowEventHandlers.onhashchange.Here你可以找到文档

if ("onhashchange" in window) {
    alert("The browser supports the hashchange event!");
}

function locationHashChanged() {
    if (location.hash === "#tab_action") {
        somecoolfeature();
    }
}

window.onhashchange = locationHashChanged;

【讨论】：

请不要使用target.onsomething = ...，而使用target.addEventListener('something' ...)！