DataTables を使用してデータを表示しています。すべての行にデータを追加して、ユーザーが特定の行にカーソルを合わせるたびに、次のpopoverような追加のデータを取得します。
<tr id="123" class="Search odd" data-title="Profile data" data-content=" <p> <label>Test Popover</label> </p>" data-original-title="" title="">
</tr>
ユーザーが行をホバーするたびにPopover、テスト ポップオーバーがテキストとして表示されます。今、いくつかの列を追加しています。
<td class=" sorting_1">Name</td>
<td class="">somedate</td>
<td class="">
<img title="Test tooltip" rel="tooltip" src="/img/paid_small.png">
</td>
ページの準備ができている私のjavascriptは
$('.Search').live('hover', function (e) {
$('.Search').popover({ 'trigger': 'hover', 'placement': 'right', 'container': 'body', 'html': true });
});
$('[rel=tooltip]').tooltip({ 'placement': 'bottom', 'container': 'body' });
ご覧のとおり、両方popoverにjavascript を追加しましTooltipたが、何らかの理由でTooltipcss が機能せず、黒い背景Tooltipではなくウィンドウのようなもの (データを含む明るい灰色のツールチップ) が表示されます。Bootstrapページ内の別の場所にダミー リンクを作成しようとしましたが、うまくいきToolTipません。
この特定のケースでPopoverはオーバーライドしているように見えます。または、(行レベルで) と(列レベルで) 同時に表示しようとしていて、それが問題を引き起こしている可能性があります。ToolTipPopoverToolTip
なぜこれが起こっているのでしょうか？
どんな助けでも大歓迎です。
ありがとう。