Bootstrap 工具提示在 chrome 中不起作用

Question

Bootstrap 工具提示在 chrome 中不起作用，但在 Firefox 中運行良好。

<script type='text/javascript'>
 jQuery(document).ready(function () {
 if ($("[rel=tooltip]").length) {
 jQuery("[rel=tooltip]").tooltip({
placement: 'right',
trigger: "hover"
});
 }
});
</script>

而且該位置在 Firefox 中無法正常工作，即使定義為正確，它也僅顯示在頂部。

Answer 1

您需要將 jQuery 更新到至少 1.7，因為看起來 bootstrap 2.2.1 正在使用.on() 。

看看你的瀏覽器控制台，它拋出了一個錯誤

未捕獲的類型錯誤：對象 [object Object] 沒有方法“on”

Answer 2

一個很老的問題，但我今天遇到了這個問題，這些答案都不適用於我的問題。 我的問題是，我一直在禁用按鈕上使用工具提示，根據 Bootstrap 的文檔，這是不可能的： https : //getbootstrap.com/docs/4.3/components/tooltips/#disabled-elements

要處理這種情況，必須使用包裝器元素，工具提示應用於其中。 例如：

<span data-toggle="tooltip" title="Disabled tooltip">
  <button class="btn btn-primary" style="pointer-events: none;" type="button" disabled>Disabled button</button>
</span>

同樣重要的是使用style="pointer-events: none;" 禁用按鈕上的屬性。 否則它也不會在 Chrome 中工作。 （Firefox 似乎也在沒有包裝器的情況下處理它。）