Всплывающая подсказка Bootstrap сохраняется после обратной навигации браузера в Rails - PullRequest
0 голосов
/ 08 мая 2018

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

Я на Rails 5 с Turbolinks.

Вот что происходит:

  1. Я нажимаю на ссылку с всплывающей подсказкой Bootstrap
  2. Ссылка выводит меня на новую страницу
  3. Я возвращаюсь к исходной странице в браузере (кнопка назад)
  4. Подсказка для ссылки, которую я щелкнул на шаге 1, активна / показана и не может быть скрыто

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

JS:

$(document).on('turbolinks:load', function(event) {
  $(function () {
    $('[data-toggle="tooltip"]').tooltip()
  });
})

Помощник вида рельсов:

<%= link_to sample_path, data: { toggle: :tooltip, placement: :bottom }, title: "Title to display" do %>
  <%= image_tag "image-src-url", alt: "Alt goes here" %>
<% end %>

Вывод HTML:

<a data-toggle="tooltip" data-placement="bottom" title="" href="/sample-path" data-original-title="Title to display">
  <img alt="Alt goes here" src="image-src-url">
</a>

Обновление:

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

1 Ответ

0 голосов
/ 09 мая 2018

В этом случае вам нужно подготовить страницу для кэширования и закрыть всплывающую подсказку на before-cached, попробуйте этот код:

document.addEventListener("turbolinks:before-cache", function () {
    $('[data-toggle="tooltip"]').tooltip('hide');
});

Я предлагаю вам ознакомиться с документацией на турболинк: https://github.com/turbolinks/turbolinks#preparing-the-page-to-be-cached

...