Question

请您查看this Demo并告诉我为什么在.data-date点击事件隐藏后，我无法在第一次点击时显示popover？

var appcontent = '<button class="btn btn-primary data-date">Close Popover</button>'; 
$(".map").popover({
        trigger: 'click',
        placement: function() { return $(window).width() < 975 ? 'bottom' : 'right'; },
        html: 'true',
        title : '<span class="" style=""><strong>What Date is today?</strong></span>'+
                '<button type="button"  class="btn btn-default close"\
     onclick="$(&quot;#pop-captcha&quot;).popover(&quot;hide&quot;);">x</button>',
        content : appcontent
  }).on('shown.bs.popover', function() {
    var popup = $(this);
    $(this).parent().find("div.popover .close").click(function() {
      popup.click();
    });
  });        

$(document).on("click", '.data-date', function(){
    $('.map').popover('hide');
});

我已经在google和堆栈溢出上尝试了一些解决方案，但它们不能在这里工作

Answer 1

那是因为你在.data-data按钮上隐藏popover并且popover实际上没有关闭所以当你再次点击.map div时它会切换打开状态以便popover关闭然后再次点击它再次打开它。希望这是有道理的。

解决方法是调用.map本身的click（）方法，就像关闭（x）按钮一样，它将切换弹出状态。

$(document).on("click", '.data-date', function(){
   $('.map').click();
});

隐藏后首次单击时显示Bootstrap Popover的问题

1 个答案: