來自Ajax的Bootstrap Popover

Question

我創建了一個jQuery插件，用於從AJAX中加載數據，然後顯示popover中的數據。當用戶再次點擊該按鈕時，該按鈕將顯示彈出窗口，而不是從AJAX重新加載數據。

下面的代碼（這是的jsfiddle https://jsfiddle.net/petrabarus/spqdqqhL/）

$.fn.myButton = function() { 
    return this.each(function() { 
     $(this).on('click', function() { 
      var w = $(this); 
      w.off('click'); 
      w.button('loading'); 
      $.post('/echo/html/', {html: "Content", delay: 1}, function(content) { 
       w.button('reset'); 
       w.popover({content: content}) 
        .popover('show'); 
      }); 
     }); 
    }); 
} 

$('.my-button').myButton(); 

的酥料餅的負荷，但奇怪的是，所顯示的酥料餅後的第一次，我必須點擊兩次隱藏酥料餅。但在此之後，彈出窗口可以正常工作：單擊一下即可顯示，另外一個可以隱藏等等。

這是怎麼回事，以及如何解決它？

Answer 1

試試這個：

$.fn.myButton = function() { 
    return this.each(function() { 
    $(this).on('click', function() { 
     var w = $(this); 
     w.off('click'); 
     w.button('loading'); 
     $.post('/echo/html/', {html: "Content", delay: 1}, function(content) { 
     w.button('reset'); 
     w.popover({content: content}); 
      //.popover('show'); 
      w.trigger("click"); // this is not proper way but it is working 
     }); 
    }); 
    }); 
} 

$('.my-button').myButton();