3

使用する

$(document).popover({
    selector: '.selector'
});

data-*target 要素で指定された属性は無視されます。
例えば

<a class="selector" title="bla" data-content="some html" data-html="true">link</a>

ポップオーバーはdata-html属性をスキップします。

証明: http://jsfiddle.net/YsEqb/

data-*問題は、デリゲートされたアタッチメント ({ セレクター: '.selector' }) の場合に、どのようにしてブートストラップが属性を考慮に入れるようにするかということです。

UPD
これはバグとして確認され、修正されました。バージョン 3.0.0 にはこのバグはありません。

4

3 に答える 3

3

データ要素は、要素の表示時ではなく初期化時に設定されるため、使用されません。これは、イニシャライザのすべてのセットに対して同じオプションのみを使用するセレクタでは機能しません。これがバグかどうかはわかりません。（更新はい、それは修正されています：https://github.com/twbs/bootstrap/issues/9222）

show 関数を拡張し、そこでオプションを (再度) 設定します。

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/js/bootstrap.min.js"></script>
<script>    

var tmp = $.fn.popover.Constructor.prototype.show
$.fn.popover.Constructor.prototype.show = function () {
  var $e = this.$element
  if (typeof($e.attr('data-html')) != 'undefined')this.options.html = ($e.attr('data-html')==='true') 
  if (typeof($e.attr('data-placement')) != 'undefined')this.options.placement = $e.attr('data-placement');
  /* add other options here */
  tmp.call(this);
}

これは、Twitter の Bootstrap 2.x および Twitter の Bootstrap 3(RC1) で機能します。

参照: http://jsfiddle.net/bassjobsen/YsEqb/1/

上記のように CDN を使用すると、ポップオーバーを閉じるときに JS エラーが発生することに注意してください (TypeError: this.remove は関数ではありません) を参照してください: https://github.com/twbs/bootstrap/issues/8887

于 2013-08-07T23:20:16.823 に答える
1

セレクターを指定すると、data-html 値がデフォルトの false にリセットされます

明示的に次のように述べています。

$(document).popover({
    selector: '[data-toggle="popover"]',
    html:true
});

この場合、data-html 値を true に設定します。 JSフィドル

于 2013-08-02T09:04:09.313 に答える
-2

使用する代わりに

 $(document).popover({
    selector: '.selector'
});

セレクターを使用したい場合、これはコードです：

$('body').popover({
        selector: '.selector'
    });

また

$('.selector').popover();
于 2013-08-02T08:22:19.600 に答える