Вызов пользовательской функции при нажатии кнопки «Закрыть» динамического всплывающего окна

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));

Для получения дополнительной информации о событиях, доступных из всплывающего окна, см. документацию