将悬停事件绑定到组合框项时出现问题

Problem binding hover event to combobox items

本文关键字:问题 组合 悬停 事件 绑定      更新时间:2023-09-26

我有以下情况。我需要显示一个工具提示与自定义文本,当鼠标光标在组合框项目(在"选项"标签)。我解决这个问题的第一个想法是使用标题标签。它在Firefox中工作得很好,但是在IE中,当文本太大时,它会被截断。

然后,我考虑使用div作为工具提示,并显示/隐藏它。我已经创建了以下代码,它在Firefox上工作(enter和leave事件被触发),但在IE中它们什么也不做。

    $(document).ready(function () {
        var $tooltip = $("#tooltip").hide();
        var $options = $("#ddlSelect option");
        $options.each(function () {
            var texto = $(this).attr("title");
            $(this).data("title", texto);
            $(this).attr("title", "");
        });
        $options.hover(function () {
            var texto = $(this).data("title");
            if (texto != "")
                $tooltip.show().text(texto);
        }, function () {
            $tooltip.hide();
        });
    });  

奥林匹克广播服务公司。"tooltip"是一个div。"ddlSelect"是一个带有一些选项的组合框。它的所有"选项"都有一个关联的标题标签,只是作为自定义文本的初始容器。

我用ie8。有人知道为什么IE不能触发这些事件吗?

谢谢

我建议这个例子来自jQuery UI:

http://jqueryui.com/demos/autocomplete/组合框

你将不得不在插件代码中为你的选项添加一个mouseover事件设置器