twitter-bootstrap - 外部リソースへのリンクとのアコーディオン

Question

アコーディオンのステータスに影響を与えないリンクを含む、ヘッダー全体のDIVをクリック可能なアコーディオンを作成しようとしていますが、代わりに新しいタブ/ウィンドウで外部リンクを開きます。

しかし、これを行うと、ヘッダーはリンク上のクリックイベントをキャプチャし、アコーディオンステータスのみを切り替えます。

コード例：

<div class="accordion" id="accordion2">
  <div class="accordion-group">
    <div class="accordion-heading accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
      <a href="http://www.google.com" target="_blank">
        Collapsible Group Item #1
      </a><br />
      whole heder is<br />
      clickable<br />
    </div>
    <div id="collapseOne" class="accordion-body collapse in">
      <div class="accordion-inner">
        Anim pariatur cliche...
      </div>
    </div>
  </div>
</div>

http://jsfiddle.net/LUzwP/6/

実装することは可能ですか？

Answer 1

http://jsfiddle.net/ZPLff/に分岐

変更:

<a href="http://www.google.com" target="_blank" id="google">

$("#google").click(function(e) {
    e.stopPropagation();
});​

reason : data-toggle="collapse"(折りたたみ可能なデータ APIe.preventDefault()で) その.on.click()ハンドラーで呼び出すため、これを防止する必要があります