Как закрыть всплывающие окна при модальном закрытии?

#twitter-bootstrap #popover

#twitter-bootstrap #всплывающее окно

Вопрос:

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

Проблема в том, что если я попытаюсь закрыть at $("#modal").on("hidden", function() { [...] }); , цели уже недоступны. То же самое происходит, если я делаю это в .on("shown", ... .

Я не могу удалить с помощью :

 $(".buttonPopover").popover("hide");
 

Потому .buttonPopover что он никогда не доступен в то время, когда я хочу удалить всплывающие окна. Как я могу закрыть их все, не обращаясь к их родительскому элементу?

Bootply

Комментарии:

1. Это нарушает мою модальность. ^^ Кроме того, я попробовал $(".popover").popover("hide"); , и это не сработало, потому что селектор должен быть целевым / родительским, а не всплывающим элементом.

2. Извините, а в cibling modal ? : $(‘#modal *’).popover(‘скрыть’); Я думаю, вам следует создать bootply, чтобы дать работу авторам ответов….

3. Не нарушает режим, хотя он не работает. Я думаю .popover() , что нужен целевой / родительский селектор, и его больше нет в модальном режиме, когда я закрываю / снова открываю его.

4. Это может быть интересно, можете ли вы создать bootply.com иметь рабочее пространство для игры на нем ?

Ответ №1:

Проблема в том, что если я попытаюсь закрыть at .on("hidden") , цели уже недоступны

Это потому hidden.bs.modal , что событие срабатывает:

«когда модал закончит скрываться от пользователя (будет ждать завершения переходов CSS)».

Вместо этого используйте hide.bs.modal событие, которое:

» запускается немедленно при вызове метода экземпляра hide»

Вот так:

 $('.modal').on('hide.bs.modal', function() {
  $("#openPopover").popover("hide")
});
 

Демонстрация в Bootply


Обновить

Мне любопытно, было ли ваше hidden событие вообще запущено в первую очередь. Имя события имеет пространство имен, поэтому вы должны ссылаться на него как hidden.bs.modal

Это никогда не будет вызвано:

 $('.modal').on('hidden', function() {
  alert('hi');
});
 

Это должно сработать:

 $('.modal').on('hidden.bs.modal', function() {
  $("#openPopover").popover("hide")
});
 

Комментарии:

1. Я должен признать, что в случае, который я привел, это работает. Но в моем случае это дает мне бесконечный цикл и заканчивается: Uncaught RangeError: Maximum call stack size exceeded после 500 вызовов этого события. (на консоли)

2. Ну, нам нужно было бы узнать больше о вашем конкретном коде, чтобы иметь возможность определить, в чем проблема. Посмотрите, сможете ли вы воспроизвести это в Bootply, а затем добавьте его сюда или отметьте завершенным и начните новый вопрос с более подробной информацией.