从另一页链接到手风琴的一部分

Mav*_*nes 21 html javascript jquery twitter-bootstrap

我正在使用twitter-Bootstrap 2.04,而我正在使用最新的jQuery.我正在尝试建立一个从一个页面到包含此手风琴的页面的链接,然后激活相应的手风琴部分.这是手风琴:

 <div class="accordion-group">
          <div class="accordion-heading">
            <a name="Alink1" class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
            <strong>Title</strong>
            </a>
          </div>
          <div id="collapseOne" class="accordion-body in collapse" style="height: auto; ">
            <div class="accordion-inner">
             some random content
            <div>
          </div>
 </div>
 <div class="accordion-group">
          <div class="accordion-heading">
            <a name="Alink2" class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
            <strong>Title 2</strong>
            </a>
          </div>
          <div id="collapseTwo" class="accordion-body collapse" style="height: 0px; ">
            <div class="accordion-inner">
             some random content 2
            <div>
          </div>
 </div>
Run Code Online (Sandbox Code Playgroud)

这是链接:

  <a href="page.html/#Alink2">Link to some interesting stuff</a>
Run Code Online (Sandbox Code Playgroud)

通过链接到页面中的一点工作通常很好,我需要使用Javascript来激活它吗?

mer*_*erv 28

是的,您需要在页面加载时手动激活它.像下面这样的东西应该工作:

$(document).ready(function () {
  location.hash && $(location.hash + '.collapse').collapse('show');
});
Run Code Online (Sandbox Code Playgroud)

此外,正如@SaadImran所指出的,这假设您链接到可折叠元素id(例如,#collapseTwo),而不是锚中的名称(例如,.#Alink2).

  • +1,你应该指出OP需要使用链接`page.html#collapseOne`而不是`page.html#Alink1` (3认同)

小智 8

谢谢你的帮助.
我添加了功能,以便代码可以打开Accordions WITHIN Accordions:

$(document).ready(function () {
  if (location.hash){
    $(location.hash).collapse('show');
    $(location.hash).parents('.accordion-body').collapse('show');
  }
});
Run Code Online (Sandbox Code Playgroud)