bootstrap:Uncaught TypeError:Object [object Object]没有方法'tooltip','typeahead'

时间:2012-10-06 21:36:07

标签: jquery jquery-ui twitter-bootstrap

我正在尝试使用bootstrap的工具提示,typeahead,datepicker功能。但我一直在控制台中收到这些错误!

Uncaught TypeError: Object [object Object] has no method 'tooltip'
Uncaught TypeError: Object [object Object] has no method 'typeahead'

这就是我的导入方式:

<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/datepicker.css" rel="stylesheet">
<link href="css/bootstrap-responsive.css" rel="stylesheet">
<script type="text/javascript" src="js/jquery-1.8.0.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/bootstrap-datepicker.js"></script>
<script type="text/javascript" src="js/bootstrap-typeahead.js"></script>
<script type="text/javascript" src="js/highcharts.js"></script>
<script type="text/javascript" src="js/exporting.js"></script>
<link type="text/css" rel="stylesheet" href="css/jquery.dropdown.css" />
<script type="text/javascript" src="js/jquery.dropdown.js"></script>

一些示例代码:

<a class="btn btn-success" data-toggle="modal" href="#payments"
           rel="tooltip" data-placement="top" title="Record your payments">
            <i class="icon-check icon-white"></i> Payments</a>

$("#payments").tooltip('show');

同样,我有datepicker和typeahead的代码。

任何解决方案?

编辑:

这就是我刚刚尝试过的:

<a href="#" rel="tooltip" data-placement="top" title="Tooltip on top">Test</a>

<script type="text/javascript">
$(function() {
    $("#").tooltip().tooltip('show');
});
</script>

但仍然没有成功。当我将鼠标悬停在Test上时,它会显示工具提示文字,但它是史前时代的。与bootstrap示例页面中显示的不同。不酷。

所以现在任何人都可以告诉我哪里出错了?

4 个答案:

答案 0 :(得分:9)

我刚遇到这个问题,我的问题是我不小心把jQuery包括了两次。

答案 1 :(得分:3)

您确定正确加载了bootstrap js文件吗?此外,您应该在调用show方法programmaticaly之前初始化元素上的工具提示插件:

<a href="#" rel="tooltip" data-placement="top" title="Tooltip on top">Test</a>

<script type="text/javascript">
$(function() {
    $("a[rel='tooltip']").tooltip();
});
</script>

这同样适用于datepickertypeahead插件。

答案 2 :(得分:0)

我可以看到你的脚本标签中不存在bootstrap-tooltip.js。

<script src="js/bootstrap-tooltip.js"></script>

答案 3 :(得分:0)

我会尝试将您的引导脚本放在所有其他脚本下面。我遇到了同样的问题,因为我的引导脚本上面有一个jQuery脚本。