3

I am having an issue where the bootstrap 4 tooltips doesn't go away with the browser's back button click:

enter image description here

I am using rails, and I do have this code:

document.addEventListener('turbolinks:load', () => {
    $('[data-toggle="tooltip"]').tooltip({
        trigger: 'hover'
    })

    $('[data-toggle="popover"]').popover()
})

The trigger: hover is working, and I got the suggestion from Bootstrap's tooltip doesn't disappear after button click & mouseleave

But they survive a back button click.

Edit, similar thing is happening with AJAX calls: enter image description here

Solved:

This code hides the tooltip whenever the element is clicked, this solves the issue.

    $('[data-toggle="tooltip"]').tooltip({
        trigger: 'hover'
    }).on('click', function() {
        $(this).tooltip('hide')
    })
15 Volts
  • 1,946
  • 15
  • 37

1 Answers1

1

On Bootstrap 5, you need the following selector:

$('[data-bs-toggle="tooltip"]').tooltip({
  trigger: 'hover'
}).on('click', function() {
  $(this).tooltip('hide')
})
Ariadni Mak
  • 41
  • 5