一个页面上有多个bootstrap popover

Question

我想使用多个popovers（超过5 ...）。全部动态添加到dom：

var popOverSettingsTemp = {

    placement: 'right',
    trigger: 'hover',
    container: 'body',
    html: true,
    title: 'Temperature',
    selector: '[data-toggle="speicherInfoTemp"]',
    template: '<div class="popover speicherInfoTemp" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>',
    content: "<table class='table_lock table table-bordered' style='margin-bottom: 0px;'>" +
    "<tr><th></th><th scope='col'>blasenspeicher</th><th scope='col'>kolbenspeicher</th></tr>"+

    "<tr><th scope='row'>°C</th><td>-32 / +60</td><td>-32 / +60</td></tr>"+
    "<tr><th scope='row'>°C</th><td>-</td><td>-60 / +60</td></tr>"+
    "</table>",
};

var popOverSettingsAccuTemp = {
    placement: 'right',
    trigger: 'hover',
    container: 'body',
    html: true,
    title: 'Accumulator Temperature',
    selector: '[data-toggle="speicherInfoSpeicherStellfahrten"]',
    template: '<div class="popover speicherInfoSpStellfahrten" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>',
    content: "<table class='table_lock table table-bordered' style='margin-bottom: 0px;'>" +
    "<tr><th></th><th scope='col'>0</th><th scope='col'>1</th><th scope='col'>2</th><th scope='col'>3</th></tr>"+

    "<tr><th scope='row'>Blasenspeicher</th><td>-</td><td><i style='color: #00b789' class='fa fa-check' aria-hidden='true'></i></td><td><i style='color: #00b789' class='fa fa-check' aria-hidden='true'></i></td><td><i style='color: #00b789' class='fa fa-check' aria-hidden='true'></i></td></tr>"+
    "<tr><th scope='row'>Kolbenspeicher</th><td>-</td><td><i style='color: #00b789' class='fa fa-check' aria-hidden='true'></i></td><td><i style='color: #00b789' class='fa fa-check' aria-hidden='true'></i></td><td><i style='color: #00b789' class='fa fa-check' aria-hidden='true'></i></td></tr>"+
    "<tr><th scope='row'>ohne Speicher</th><td><i style='color: #00b789' class='fa fa-check' aria-hidden='true'></i></td><td>-</td><td>-</td><td>-</td></tr>"+
    "</table>",
};

我在某些情况下将它们添加到表格元素中：

$('.myElement').parent().next().attr('data-toggle',"speicherInfoTemp");
        $('body').popover(popOverSettingsTemp);

或

$('.myScndElement').parent().next().attr('data-toggle',"speicherInfoSpeicherStellfahrten");
            $('body').popover(popOverSettingsAccuTemp);

只有第一个被触发才有效，另一个没有。