Bootstrap popover错误

时间:2017-07-31 22:58:24

标签: javascript jquery twitter-bootstrap popover

我试图低调和引导弹出窗口。我决定在里面添加一个按钮。但它没有按预期工作,因为它在关闭后读取内容。我使用屏幕阅读器NVDA来阅读页面(我希望它可以访问)

https://jsfiddle.net/devmyrrie/qv5vp9qc/

<button  type="button" class='fa fa-question-circle claim-icon' data-placement='above'>Open Popover</button>
<div id="popover_content_wrapper" class="popover_content_wrapper" style="display:none">
   <div>
      Awesome example
   </div>
   <button type="button" id="fh-tooltip-close" class="fh-tooltip-close" aria-label="Close tooltip"> x
   </button>
</div>

和Jquery:

$(document).ready(function () {

    var claimIconState = false;

    $('.claim-icon').popover({
      html: true,
      content: function () {
        return $('#popover_content_wrapper').html();
      }
    })


    $(".claim-icon").on('shown.bs.popover', function (e) {

      //When a close tooltip button  is clicked we need to  bring focus back to the button who opened the tooltip
      $(".popover-content").find('.fh-tooltip-close').on('click', function () {

        //Focus to button that  opend it
        $('.claim-icon').focus();
        $('.claim-icon').popover("hide");
      });

    });
    $('.claim-icon').on('hidden.bs.popover', function (e) {
      $(e.target).data("bs.popover").inState.click = false;
      $('.fh-tooltip').attr("aria-hidden", "false");
    });

  });

当我点击关闭按钮时,它会读取现在消失的弹出窗口的内容。知道为什么吗?

0 个答案:

没有答案