Question

我有一个带有自定义插件的动态弹出窗口。

(function($) {
  $(voiceIMage).popover({
    placement: 'bottom',
    html: 'true',
    title: '<span class="text-info"><strong>title</strong></span>' +
      '<button type="button" id="close" class="close" onclick="closePopover(event)">&times;</button>',
    content: 'test'
  });

  function closePopover(e) {
    console.log('Done')
  }
}(jQuery));

上面的代码不起作用。如何在关闭按钮单击即动态弹出窗口时应用此closePopover()函数。

Answer 1

问题是因为从onclick属性调用的函数需要在全局范围内可用。因此，您需要将closePopover()函数的定义移到该级别（即，在IIFE之外）。

但是，更好的解决方案是在元素关闭时使用从Bootstrap弹出框本身引发的事件：

(function($) {
  $(function() {
    $(voiceIMage).popover({
      placement: 'bottom',
      html: 'true',
      title: '<span class="text-info"><strong>title</strong></span><button type="button" class="close">&times;</button>',
      content: 'test'
    }).on('hidden.bs.popover', function() {
      console.log('Done')
    });

    $('.close').click(function() {
      $(voiceIMage).popover('hide');
    });
  });
}(jQuery));

有关弹出式窗口中可用事件的更多信息，请参见documentation

在动态弹出框的关闭按钮单击上调用自定义功能

1 个答案: