1

同じクラスを共有する複数の要素でブートストラップ ポップオーバー プラグインを機能させようとしています。今のところ、大きな灰色のブロック レベルの「詳細情報」ボタンです。ここでリンクを見つけることができます

以前はid="pop"、次のような JavaScript のような単一の ID の場合にポップオーバーが機能していました。

$(document).ready(function() {
   $('#pop').popover()
});

ただし、「詳細情報」という 2 つのボタンを変更し、それに応じて JavaScript を修正すると、複数のボタンでポップオーバーが機能しなくなりますfrom id="pop"。class="pop"

$(document).ready(function() {
   $('.pop').popover()
});

<a class="btn btn-block pop" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." data-placement="top" data-toggle="popover" data-original-title="Popover on right">More Information</a></p>

ポップオーバー プラグインが同じクラスの複数の要素で機能しない場合はありますか? 私が提供したリンクを見ると、コンソールエラーはありません。

4

2 に答える 2

0

次のようなものを使用できます。

$('.pop').popover({
    html: true,
    content:mycontent,
    trigger: 'manual'
}).click(function(e) {
    $(this).popover('toggle');
    e.stopPropagation();
});

私のjsfiddleをチェックしてください

于 2013-04-22T18:24:45.040 に答える
0

JavaScript の場合:

$(document).ready(function() {
  options = {
   placement: 'top',
   trigger : 'click'
  }
  $('[rel="popover"]').popover(options);
});

Html で:

<p><a class="btn btn-block pop" rel="popover" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." data-original-title="Popover on right">More Information</a></p>

<p><a class="btn btn-block pop" rel="popover" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." data-original-title="Popover on right">More Information</a></p>
于 2013-06-26T19:47:43.150 に答える