為什么我的Bootstrap JavaScript無法正常工作？

Question

我看過其他問題並仔細檢查。 我的javascript資源井井有條，沒有路徑問題，我什至在我的頁面上也有jquery項目。 為了測試，我將這些代碼放在“社交媒體圖標”標題的上方，但仍然一無所獲。

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</button>

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="top" title="Tooltip on top">Tooltip on top</button>

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</button>

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="right" title="Tooltip on right">Tooltip on right</button>


$(document).ready(function () {        

    $('#section-nav a').tooltip();

    $(".tab").tabs();


    $(".tabs-bottom .ui-tabs-nav, .tabs-bottom .ui-tabs-nav > *")
      .removeClass("ui-corner-all ui-corner-top")
      .addClass("ui-corner-bottom");

    // move the nav to the bottom
    $(".tabs-bottom .ui-tabs-nav").appendTo(".tabs-bottom");

    $('.navbar-toggle').click(function () {
        var target = $('#navigation .shopbar');

        if (target.hasClass('border-bottom')) {
            target.removeClass('border-bottom');
        } else {
            target.addClass('border-bottom');
        }
    });

});

Answer 1

來自Bootstrap文檔。（ http://getbootstrap.com/javascript/#tooltips ）

“出於性能方面的考慮，工具提示和Popover數據API是可選的，這意味着您必須自己對其進行初始化。”

因此，您需要添加此jQuery。

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

初始化工具提示。

Answer 2

將data-original-title更改為title ，然后：

$('#section-nav a').tooltip();