从另一个页面链接到 Bootstrap 3 手风琴内的 DIV答案

【问题标题】：Linking to a DIV inside a Bootstrap 3 accordion from another page从另一个页面链接到 Bootstrap 3 手风琴内的 DIV
【发布时间】：2015-06-16 20:01:41
【问题描述】：

我看到了类似问题over here 的一个看起来很棒的解决方案，但由于某种原因，我似乎无法在my page 上找到相同的解决方案。我正在尝试创建指向该部分的直接链接，但是当我输入 http://www.scicoll.org/events.html#DC-GRB 时，它似乎不起作用。

我是 JavaScript 的新手（总有一天我会通过剪切和粘贴！），所以任何帮助将不胜感激！

【问题讨论】：

嘿伙计，我可以看到您的手风琴正在工作。您遇到的问题是默认情况下 PAST 选项卡未处于活动状态，因此您看不到手风琴。
啊，你是对的！谢谢！

标签： javascript html twitter-bootstrap accordion collapse

【解决方案1】：

实际上你有正常工作的东西：

$(document).ready(function () {
  location.hash && $(location.hash + '.collapse').collapse('show');
});

显示所需信息的折叠现在不是您的问题。只需要捕获您的 URL 哈希 来自不同的标签 并在隐藏时显示它。您可以在页面底部的 jquery 脚本中添加此代码：

$(document).ready(function () {
  location.hash && $(location.hash + '.collapse').collapse('show');
  if(location.hash.length > 2 && location.hash.substring(1,3) == "DC"){
    $('[href=#past]').trigger('click');
  }
});

这意味着：如果您的 location.hash 已启用并且大于 2（例如 #DC-GRB），您将在包含您信息的相关 a 链接上触发事件 "click"。

或者（你可以把逻辑验证放在前面）：

if(location.hash){
    $("a[href=#"+$(location.hash).closest(".tab-pane").attr("id")+"]").trigger("click");
}

在哈希和选项卡之间添加所有验证流程。

【讨论】：

SerCrAsH，谢谢！效果很好！特别感谢您解释逻辑 - 我从您的回答中学到了很多东西。