Javascript 引导工具提示-未找到工具提示功能

Javascript 引导工具提示-未找到工具提示功能,javascript,jquery,html,css,twitter-bootstrap,Javascript,Jquery,Html,Css,Twitter Bootstrap,我试图在引导中使用工具提示,这样当用户鼠标移动到链接上时,文本就会出现。您可以在此处看到它的外观: 相反,当我将鼠标悬停在链接上时,什么也不会发生。这是我的HTML: <div class="form-group"> <label for="test" class="quoteform"><a href="#" data-toggle="tooltip" class="tip-left tool

我试图在引导中使用工具提示,这样当用户鼠标移动到链接上时,文本就会出现。您可以在此处看到它的外观:

相反,当我将鼠标悬停在链接上时,什么也不会发生。这是我的HTML:

                <div class="form-group">
                    <label for="test" class="quoteform"><a href="#" data-toggle="tooltip" class="tip-left toollink" data-original-title="This text should appear in a tooltip."><i class="fa fa-question-circle"></i></a>Test<span aria-required="true" class="required">* <span></span></span></label>
                    <select class="form-control quotedetails" id="test">
                        <option value="" selected="" disabled="">Please select</option>
                        <option>1</option>
                        <option>2</option>
                        <option>3</option>
                        <option>4</option>
                    </select>
                </div>
下面是我在标题中运行的JS:

<script type="text/javascript">
    $(document).ready(function(){
        $(".tip-top").tooltip({
            placement : 'top'
        });
        $(".tip-right").tooltip({
            placement : 'right'
        });
        $(".tip-bottom").tooltip({
            placement : 'bottom'
        });
        $(".tip-left").tooltip({
            placement : 'left'
        });
    });
当我运行页面时,我得到以下错误:TypeError:$..工具提示不是一个函数。我认为这可能是因为我错误地链接到jquery和bootstrap.min.js,但我可以导航到它们,它们看起来很好。此外,我尝试用指向各自CDN的链接替换它们,但没有任何区别

以下是我链接到的JS文件:

<!-- Scripts -->
    <script src="/js/plugins/jquery.1.11.0.js"></script>
    <script src="/js/plugins/bootstrap.min.js"></script>
    <script src="/js/plugins/bootstrap-dialog.min.js"></script>
    <script src="/js/owl.carousel.js"></script>
    <script src="/js/custom.js"></script>
    <script src="/js/validate.js"></script>
    <script src="/js/plugins/sticky-tabs.min.js"></script>
    <script src="/js/plugins/jquery.select2list.min.js"></script>

看起来您没有添加tooltip.js。这是一个额外的插件,你需要包括

为工具提示添加JS

工具提示JS

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

我认为您没有正确地包含js和css,因为在JSFIDLE中它对我来说工作得很好

下面是演示工作示例

$function{ $'[data toggle=tooltip]'。工具提示 } 左侧的工具提示 顶部的工具提示 底部的工具提示 右边的工具提示
我尝试了你的代码,我所要做的就是把.tip left改为.tip bottom。不知怎的,工具提示在左侧不可见。我建议您尝试删除脚本,除了jquery、bootstrap.min.js、bootstrap.min.css和font-awesome.min.css之外,工具提示不需要这些脚本,由于bootstrap无法与其他jquery插件(如jquery ui等)配合使用。

您确定包含bootstrap.js文件吗?最常见的原因是包含js文件的顺序错误或路径错误,特别是如果你在一个改变路径的cms中工作。你是否包含了tooltip.js文件。tooltip.js不是bootstrap.min.js的一部分吗?我尝试了你的代码,它的工作将你的html/js添加到我的页面中进行测试,并且再次得到相同的错误-TypeError:$…tooltip不是一个函数。不确定是什么原因导致了这种情况,因为我尝试了本地版本的jquery/bootstrap.min.js和CDN版本。您希望工具提示具体在哪里?在下拉列表中的链接上?下拉列表标签左侧