Как скрыть подсказки, нажав на них?

Question

Как сделать так, чтобы всплывающая подсказка никогда не скрывалась, если на нее не нажата действительная подсказка?Будет ли попсовер работать лучше для этого?

var Button = document.querySelector('.Button');

$(Button).attr("data-toggle", "tooltip");
$(Button).attr("data-placement", "top");
$(Button).attr("title", "SHOWING TOOLTIP");

$('[data-toggle="tooltip"]').tooltip(); 

if(status == true) {

        $(Button).tooltip('show');
        $(Button)
            .mouseenter(function() {
                $(this).tooltip('show');
            })
            .mouseleave(function() {
                $(this).tooltip('show');
            });
        $(Button).click(function() {
                console.log("clicked tooltip");
                $(this).tooltip('hide');
            });
    }

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

ПроблемаЯ имею в виду, что если я нажимаю на всплывающую подсказку, она не скрывает всплывающую подсказку, а просто нажимает на элемент кнопки.Есть ли что-нибудь вокруг этого?Цель, которую я пытаюсь достичь, заключается в том, чтобы всплывающая подсказка постоянно отображалась, а затем скрывалась при щелчке по всплывающей подсказке.

РЕДАКТИРОВАТЬ: я использую Bootstrap для подсказки вместе с jQuery.

Answer 1

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

$('[data-toggle=tooltip]').on('shown.bs.tooltip', function () {
    $(".tooltip-inner").click(function(e){
        $('[data-toggle=tooltip]').tooltip("hide");
    });
});

https://www.codeply.com/go/6M28mCZHwE

Если вы только хотите всплывающую подсказкучтобы скрыть всплывающую подсказку, измените триггер данных на manual и добавьте обработчик щелчков, чтобы отобразить подсказку.Это предотвратит скрытие подсказки триггером.

$('[data-toggle=tooltip]').click(function(){
    $(this).tooltip("show");
});