0

这是一个js小提琴

JS

$(function(){
    $("select").multiselect();
    $( document ).tooltip();
    $( document ).tooltip( "option", "position", { my: "left+20 center", at: "right center" } );
});

HTML

<select multiple="multiple" size="5">
<optgroup label="England">
    <option title="example 1" value="London">London</option>
    <option title="example 2" value="Leeds">Leeds</option>
    <option title="example 3" value="option3">Manchaster</option>
</optgroup>
<optgroup label="USA">
    <option title="example 4" value="option4">New York</option>
    <option title="example 5" value="option5">Chicago</option>
</optgroup>
</select>

我正在使用 Eric Hynds 的多选小部件以及带有 jQ​​uery 1.9.1 的 jQuery UI 工具提示小部件。

我希望当用户将鼠标悬停在多选小部件中的每个项目上时出现工具提示。为此，我为小部件中的每个选项定义了一个“标题”属性。这工作得很好，除了多选小部件也有它自己的工具提示出现，其中包含每个选项value。因此，每个选项都有两个工具提示。

我想禁用多选的固有工具提示，或者让我自己的工具提示与“标题”之外的另一个属性一起使用（到目前为止，我找不到任何其他可以在标签内使用的属性）。或者，还有其他想法吗？

4

1 回答 1

0

工作 JS 小提琴

所以基本上，发生的事情是多选插件正在添加并为所有输入创建额外的标题属性，因此 jquery ui 也会自动在那些工具提示上发挥其魔力。

一个简单的解决方法是在 jquery ui 启动之前删除多选添加的标题属性。

注意：在我的示例中，我将删除所有输入标题道具。在您的生产环境中，您可能不想这样做，因此您可以提高效率并根据需要使用类似的东西：

$('_multiselect_widget_id').find('input').prop('title', '');

这是我的工作代码：

$(function(){
    $("select").multiselect();
    $('input').prop('title', '');


    $( document ).tooltip();
    $( document ).tooltip( "option", "position", { my: "left+20 center", at: "right center" } );
});
于 2013-08-10T19:23:59.253 回答