Bootstrap工具提示不会隐藏在 tag click上

Question

我正在使用触发器作为悬停，但是当我点击具有此功能的链接时，工具提示不会消失，它将永远在屏幕上打扰

使用此代码实例化工具提示

$('[data-toggle="tooltip"]').tooltip({
    container: 'body',
    trigger: 'hover'
});

在标签中一切都很完美，在某些情况下也有效，我不知道为什么会发生这种情况，有人会给我一个亮点吗？

编辑：我也尝试使用此代码隐藏click事件的工具提示

$(document).ready(function(){
     $('[data-toggle="tooltip"]').click(function () {
         $('[data-toggle="tooltip"]').tooltip("hide");
     });
});

但它不起作用

编辑*：图片如何（文字是葡萄牙语）

编辑**：HTML代码

<ul style="clear: both;" class="pager wizard">
    <li class="button-previous previous"><a title="Voltar" data-toggle="tooltip"><i class="fa fa-arrow-left"></i></a></li>
    <li class="voltar"><a title="Voltar" data-toggle="tooltip"><i class="fa fa-arrow-left"></i></a></li>

    <li class="finalizar"><a>Finalizar<i class="fa fa-check" style="padding-left:5px;"></i></a></li>
    <li class="next"><a class="competencia-stripe" data-toggle="tooltip" title="Continuar"><i class="fa fa-arrow-right" ></i></a></li>
</ul>

Answer 1

我能够以一种简单的方式解决它，这是解决方案

window.addEventListener("click", function (event) {
   $('.tooltip.fade.top.in').tooltip("hide");
}

Answer 2

您还需要绑定点击功能 https://getbootstrap.com/docs/4.0/components/tooltips/

$('[data-toggle="tooltip"]').tooltip({
    container: 'body',
    trigger: 'hover click'
});