close popover when click on close button is not working in ie8

Question

This issue is only present in IE8, IE7 - It works in all other browsers

Even after debugging i found that though the alert is coming first time inside the click event of button but not on second flow.

Please guide??

 $.fn.extend({
    popoverClosable: function (options) {
        var defaults = {
            template:
                '<div class="popover">\
<div class="arrow"></div>\
<div class="popover-header">\
<button type="button" class="close popclose" data-dismiss="popover" aria-hidden="true">&times;</button>\
<h3 class="popover-title"></h3>\
</div>\
<div class="popover-content"></div>\
</div>'
        };
        options = $.extend({}, defaults, options);
        var $popover_togglers = this;
        $popover_togglers.popover(options);
        $popover_togglers.on('click', function (e) {
            e.preventDefault();
            $popover_togglers.not(this).popover('hide');
        });
        $('html').on('click', '[data-dismiss="popover"]', function (e) {
            $popover_togglers.popover('hide');
            e.preventdefault();
        });
    }
});

$(function () {
    $('[data-toggle="popover"]').popoverClosable();

});

Answer 1

Are you using jQuery 1.9 or 2+? The latter does not work with IE8 or below.

Answer 2

did you try to change this line :

$('html').on('click', '[data-dismiss="popover"]', function (e) {
$popover_togglers.popover('hide');
e.preventdefault();
});

with that :

$('html').on('click', '[data-dismiss="popover"]', function (e) {
$popover_togglers.data('bs.popover').tip().removeClass("in").hide();
});

Answer 3

您可以使用“ toggle”而不是“ hide”，因为在我的Web应用程序上，.popover（'toggle'）在IE8上有效。