javascript - 当我将鼠标悬停在下拉列表中的某个项目上时，如何显示 JQuery 工具提示？

Question

该工具提示适用于除下拉项目之外的所有其他内容。

我究竟做错了什么

$(document).ready(function(){
    $('option').each(function(){
        $(this).tooltip();
    });
    //$('option').tooltip();
});

编辑：我的 html 目前非常基本http://jsfiddle.net/kasfu/

编辑我希望当我将鼠标悬停在下拉列表中的项目上时显示工具提示

Answer 1

从外观上看，它与您的代码无关。这是一个已知问题，而且看起来不会修复（无论如何很快）。工具提示在 chrome 中确实有效，但是 webkit 浏览器不喜欢option元素上的工具提示。

请参阅此处获取错误票

我想你有我能想到的三个解决方案。

1. 找到一个不同的/构建你自己的有效的工具提示插件。

2. 使用 a<ul>并设置样式使其看起来像一个下拉菜单，并添加一些 jQuery 来控制显示/隐藏

3. 只需坚持浏览器标准工具提示即可。

希望这可以帮助。

Answer 2

从您的工具提示插件链接。我想，这取决于jquery.dimensions.js and jquery.bgiframe.js 演示页面。

Answer 3

我认为你应该试试这个

$('option').each(function(index, element){
        $(element).tooltip({ content: "<div>Select an Item</div>", track: true});
    });

Answer 4

我想我有你需要的东西。。

<select>
    <option title="1" >1</option>
    <option title="2">2</option>
    <option title="3">3</option>
</select>

$(document).ready(function(){
$('option').each(function(){
        $(this).style.top = window.event.clientY + 20;
        $(this).style.left = window.event.clientX;
        $(this).style.display = 'block';
        $(this).tooltip();
    });
});

希望这可以帮助。