试图使用jquery工具提示插件,对象没有方法“工具提示”

时间:2011-09-30 01:03:35

标签: jquery jquery-ui tooltip jquery-tooltip

我正在使用此工具提示:http://flowplayer.org/tools/demos/tooltip/index.html

我的html文件中有以下几行:

<script src="/javascripts/home.js" type="text/javascript"></script>
<script src="http://cdn.jquerytools.org/1.2.6/jquery.tools.min.js" type="text/javascript"></script>
<script type="text/javascript" src="/scripts/jquery.min.js"></script>

<div id="boo">
<img src="image1.jpg" title="this thing is a tool"/>
<img src="image2.jpg" title="this thing is also tool"/>
</div>

我的home.js文件中有以下行:

$("#boo img[title]").tooltip();

我的css文件中有以下行:

.tooltip {
    display:none;
    background:transparent url(/tools/img/tooltip/black_arrow.png);
    font-size:12px;
    height:70px;
    width:160px;
    padding:25px;
    color:#fff; 
}

我收到此错误:

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

我的智慧结束了。我觉得我已经完全按照网站上的例子,但不知道发生了什么。

3 个答案:

答案 0 :(得分:11)

您应该重新排序您的js文件:

<script type="text/javascript" src="/scripts/jquery.min.js"></script>
<script src="http://cdn.jquerytools.org/1.2.6/jquery.tools.min.js" type="text/javascript"></script>
<script src="/javascripts/home.js" type="text/javascript"></script>

对于遇到此问题的其他人的更多解释:

脚本按照调用的顺序加载,因此您要首先加载jQuery,然后加载任何插件,然后加载自定义代码。

答案 1 :(得分:3)

也遇到了这个问题,这是因为在源文件夹中丢失了旧版本的jquery,是jquery v1.6.2。 如果它可以帮助别人......祝你有愉快的一天!

答案 2 :(得分:1)

$("#boo img[title]").tooltip();中换取$(function(){ });,以便最终得到:

$(function(){
    $("#boo img[title]").tooltip();
});

为什么:

$(function()...是在domReady事件上执行该代码的捷径。所以在这一点上,所有jquery文件和页面都将被加载到足以让你的javascript工作。