Question

我在description items内有collapsible elements，如下所示：

<div class="accordion" id="accordion">
  <div class="accordion-group">
    <div class="accordion-heading">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
        Section 1
      </a>
    </div>
    <div id="collapseOne" class="accordion-body collapse">
      <div class="accordion-inner">
        <dl>
          <dt>Element 1-1</dt>
          <dd>The description of element 1-1</dd><br>

          <dt>Element 1-2</dt>
          <dd>The description of element 1-2</dd><br>
        </dl>
      </div>
    </div>
  </div>
  <div class="accordion-group">
    <div class="accordion-heading">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">
        Section 2
      </a>
    </div>
    <div id="collapseTwo" class="accordion-body collapse">
      <div class="accordion-inner">
        <dl>
          <dt>Element 2-1</dt>
          <dd>The description of element 2-1</dd><br>

          <dt>Element 2-2</dt>
          <dd>The description of element 2-2</dd><br>
        </dl>
      </div>
    </div>
  </div>
</div>

因此，默认情况下隐藏这两个部分的内容。我如何支持直接链接：

第2节（因此，应显示该部分的内容）;
元素2-2（所以，应该显示第2节的内容，应该关注元素2-2）？

Answer 1

你可以使用哈希网址，例如#section2/element2

然后挂钩2个事件：window.onload和window.onhashchange 在事件处理程序中，处理location.hash并以编程方式展开特定部分，然后将特定元素集中在该部分中。

如何在可折叠部分中创建指向特定描述元素的链接？

1 个答案: