ol-overlaycontainer-stopeventでブートストラップタブにイベントが渡されない

Question

OpenLayers 3を使用してマップインターフェイスを作成しています。ベクトルフィーチャーを選択すると、小さなコントロールパネル（ol.control.Controlを拡張）が表示されます。 Twitter Bootstrapを使用してこのコントロールパネルに複数のタブを追加しようとしていますが、タブスイッチを起動するために必要なイベントがBootstrapになっていないことがわかりました。私は、制御がCSSクラスol-overlaycontainer-stopeventの<div>に配置されているため、これが原因でBootstrapのリスナーがイベントを聞こえなくなっていることがわかりました。

ここには私がしようとしているもののstripped down JSFiddle exampleがあります。タブをクリックしても何も起こらないことがわかります。このイベントがブートストラップのタブリスナーに確実に届くようにするにはどうすればよいですか？

P.S.ブートストラップのソースコードから、それはリスナーがあなたがそうあなたのページにclickイベントを追加しませんでした

$(document) 
    .on('click.bs.tab.data-api', '[data-toggle="tab"]', clickHandler) 
    .on('click.bs.tab.data-api', '[data-toggle="pill"]', clickHandler) 

Answer 1

で定義されているように見える、それを追加します。

$('#prop-box-content li > a').click(function (e) { 
    e.preventDefault(); 
    console.log(e.target); 
    $(this).tab('show'); 
});