2015-06-29 34 views
2

您可以看看This Demo並讓我知道爲什麼我無法彈出彈出窗口通過添加的關閉按鈕關閉彈出窗口後的第一次單擊?在Bootstrap Popover關閉按鈕上出現問題

$(document).ready(function(){ 
    $('[data-toggle="popover"]').popover({ 
     placement : 'top', 
     html : true, 
     title : 'User Info <a href="#" class="close" data-dismiss="alert">×</a>', 
     content : '<div class="media"><a href="#" class="pull-left"><img src="../images/avatar-tiny.jpg" class="media-object" alt="Sample Image"></a><div class="media-body"><h4 class="media-heading">Jhon Carter</h4><p>Excellent Bootstrap popover! I really love it.</p></div></div>' 
    }); 
    $(document).on("click", ".popover .close" , function(){ 
     $(this).parents(".popover").popover('hide'); 
    }); 
}); 

,你可以看到酥料餅可以用點擊<button>Click Me</button每一次,但是當我通過x(關閉)按鈕,它是不是在彈出關閉它第一次嘗試!但它在第二次點擊!

回答

3

不知道爲什麼發生這種情況 - 它似乎是一個錯誤。但是,你可以解決它通過簡單地觸發酥料餅按鈕的點擊事件,當用戶點擊關閉按鈕:

$(document).ready(function(){ 
    $('[data-toggle="popover"]').popover({ 
     placement : 'top', 
     html : true, 
     title : 'User Info <a href="#" class="close" data-dismiss="alert">×</a>', 
     content : '<div class="media"><a href="#" class="pull-left"><img src="../images/avatar-tiny.jpg" class="media-object" alt="Sample Image"></a><div class="media-body"><h4 class="media-heading">Jhon Carter</h4><p>Excellent Bootstrap popover! I really love it.</p></div></div>' 
    }).on('shown.bs.popover', function() { 
     var popup = $(this); 
     $(this).parent().find("div.popover .close").click(function() { 
     popup.click(); 
     }); 
    }); 
}); 

Demo Here