2

我创建了一个 ID 为“tt-content”的 div，当我将鼠标悬停在链接上时，我希望 div 和其中包含的所有 html 显示为工具提示。我使用了 jquery bodyhandler，但我的代码仍然无法正常工作。我最近才开始编码，所以我不知道这是我的语法问题还是代码完全错误。先感谢您。

<html>
<head>

<script type="text/javascript"     src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" >

$(document).ready(function(){
   $("a").hover(function () {

        $("a").tooltip({
         bodyHandler: function() { 
        return $("#tt-content").html(); 
    },
    showURL: false 
        });
    });
});
</script>


</head>

<body>
<a href="#">Display Tooltip</a>


<div  id= "tt-content" style="width:250px" >

<p>HTML TO BE DISPLAYED IN THE TOOLTIP.</p>
<p>EVEN MORE HTML</P>


</div>


</body>



</html>
4

3 回答 3

1

JQuery 函数工具提示不是核心 jquery 库的一部分，它是维度库http://docs.jquery.com/Plugins/Tooltip的一部分，因此您需要添加对此的引用。也就是说，Jquery 页面上的 Drupal 站点似乎已关闭....

于 2012-06-25T11:03:38.173 回答
1

您正在使用 jQuery 的插件并忘记包含它的 javascript 和 css 文件：

<script type="text/javascript" src="http://jquery.bassistance.de/tooltip/jquery.tooltip.js"></script>
<link rel="stylesheet" href="http://jquery.bassistance.de/tooltip/jquery.tooltip.css" />
<!-- You would probably need to copy those files to your server. -->
于 2012-06-25T11:03:57.813 回答
1

如果您没有丢失任何特定的插件 JS 文件，请在您的脚本标记之前包含这些 JS。

检查 jquery 工具提示的演示 - http://docs.jquery.com/Plugins/Tooltip/tooltip#options

<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/tooltip/jquery.dimensions.js"></script>
<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/tooltip/jquery.tooltip.js"></script>
于 2012-06-25T11:07:58.663 回答