21

私は 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>

これはリンクです:

  <a href="page.html/#Alink2">Link to some interesting stuff</a>

通常、ページ内のほんの少しへのリンクは正常に機能しますが、有効にするために Javascript を使用する必要がありますか?

4

4 に答える 4

28

はい、ページの読み込み時に手動でアクティブ化する必要があります。次のようなものが機能するはずです。

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

また、@ SaadImranが指摘したように、これは#collapseTwo、アンカー内の名前(たとえば、)ではなく、折りたたみ可能な要素ID(たとえば、)にリンクしていることを前提としています#Alink2

于 2012-08-17T15:48:42.043 に答える
8

ご協力いただきありがとうございます。
コードがアコーディオン内でアコーディオンを開くことができるように機能を追加しました。

$(document).ready(function () {
  if (location.hash){
    $(location.hash).collapse('show');
    $(location.hash).parents('.accordion-body').collapse('show');
  }
});
于 2013-03-05T18:57:24.350 に答える
3

アコーディオン部の位置を利用できます。次のリンクは、Twitter ブートストラップ (ワードプレス) アコーディオンの 3 番目のアコーディオン セクションを開きます。

リンク例: http://www.zfp-bauwesen.de/leistungen/ubersicht#3

JavaScript コード:

$( document ).ready(function() {

 if (window.location.hash) {
   var AccordionSectionNumber = window.location.hash.substring(1);
   AccordionBodyID = $(".accordion .accordion-group:nth-of-type(" + AccordionSectionNumber + ") .accordion-heading a").attr('href')
      if (! (typeof AccordionBodyID === "undefined")) {
        $(AccordionBodyID).collapse('show');
        return true;
      }
    }

});
于 2013-10-09T13:29:52.557 に答える
2

これを試しましたか:

<a href="page.html#Alink2">Link to some interesting stuff</a>
于 2012-08-17T15:14:06.207 に答える