Блог

Рассмотрим следующее:

 <ul class="nav nav-tabs">
  <li class="nav-item">
    <a class="nav-link active diabled" data-toggle="tab" href="#home">Home</a>
    <i class="fas fa-circle missing-data" data-toggle="tooltip" data-placement="top" title="Missing Data"></i>
  </li>
  <li class="nav-item">
    <a class="nav-link diabled" data-toggle="tab" href="#menu1">Menu 1</a>
  </li>
  <li class="nav-item">
    <a class="nav-link diabled" data-toggle="tab" href="#menu2">Menu 2</a>
  </li>
</ul>
  

С помощью следующего JS:

 $(document).ready(function() {
  $('body').tooltip({
    selector: '[data-toggle="tooltip"]',
    html: true,
  });
});
  

Что я пытаюсь сделать без повторного включения вкладок, так это заставить всплывающую подсказку работать, пока внутри nav-item это было disabled .

Есть мысли?

В настоящее время это не работает.

Прежде всего, в вашем примере кода вы неправильно написали отключено.

В bootstrap4 nav-item необязательно при создании вкладки. Вы можете создать вкладку, просто используя nav и nav-link s.

Всплывающая подсказка работает как внутри nav-item , так и с отключенной nav-link :

 <ul class="nav nav-tabs">
    <li class="nav-item">
        <a class="nav-link active disabled" data-toggle="tab" href="#home">Home
            <i class="fas fa-circle missing-data" data-toggle="tooltip" data-placement="top" title="Missing Data"></i>
        </a>
    </li>
    <li class="nav-item">
        <a class="nav-link disabled" data-toggle="tab" href="#menu1">Menu 1
            <i class="fas fa-circle missing-data" data-toggle="tooltip" data-placement="top" title="Missing Data"></i></a>
    </li>
    <li class="nav-item">
        <a class="nav-link disabled" data-toggle="tab" href="#menu2">Menu 2
            <i class="fas fa-circle missing-data" data-toggle="tooltip" data-placement="top" title="Missing Data"></i></a>
    </li>
</ul>
  

https://jsfiddle.net/davidliang2008/fjw5c67d/8/