Twitter Bootstrap popover不能在第一次點擊時工作

Question

當我點擊一個錨點時，顯示一個彈出窗口。但是，彈出式廣告不會在第一次點擊時觸發，但它在第二次點擊中的效果如何。

HTML：

<!-- Pop Check --> 
<div class="popover-markup"> 
    <input class="checkbox-inline" type="checkbox" value="Option1"> 
    <a href="javascript:void(0)" class="trigger" data-placement="bottom" tooltip="Manage Users">Option1</a> 
    <!-- Popup Content--> 
    <div class="content hide"> 
     <div class="head hide">Select Users For Option1<span class="close_popover"><i class="fa fa-times"></i></span></div> 
     <div> 
     <label class="checkbox-inline"> 
     <input type="checkbox" id="" class="si_DSCM" value="user6"> User 6 
     </label> 
     </div> 
    </div> 
</div> 

JS：

$(document).on('click', ".popover-markup>.trigger", function() { 

    $(this).popover({ 
     html: true, 
     title: function() { 
      return $(this).parent().find('.head').html(); 
     }, 
     content: function() { 
      return $(this).parent().find('.content').html(); 
     } 
    });  
}); 

這是我的小提琴：https://jsfiddle.net/47pef6g8/

我發現類似的問題，但它並沒有幫助我在我的情況。

請幫忙。提前致謝。

Answer 1

查看你的代碼，很清楚你正在初始化點擊的彈出窗口。因此需要兩次點擊來顯示彈出窗口。我的建議是在文檔加載時初始化彈出窗口。

根據您的問題檢查樣本Fiddle。

$('[data-toggle="popover"]').popover({ 
    html: true, 
    title: function() { 
     return $(this).parent().find('.head').html(); 
    }, 
    content: function() { 
     return $(this).parent().find('.content').html(); 
    } 
}); 

希望這會有所幫助。

- 幫助:)