我希望延迟jQuery中的悬停事件.当用户将鼠标悬停在链接或标签上时,我正在读取文件.我不希望此事件立即发生,以防用户只是在屏幕上移动鼠标.有没有办法推迟事件的发生?

非常感谢.

示例代码:

$(function() {
    $('#container a').hover(function() {
        $('<div id="fileinfo" />').load('ReadTextFileX.aspx',
            {filename:'file.txt'},
            function() {
                $(this).appendTo('#info');
            }
         );
    },
        function() { $('#info').remove(); }
    });
});

UPDATE: (1/14/09) After adding the HoverIntent plugin the above code was changed to the following to implement it. Very simple to implement.

$(function() {
    hiConfig = {
        sensitivity: 3, // number = sensitivity threshold (must be 1 or higher)
        interval: 200, // number = milliseconds for onMouseOver polling interval
        timeout: 200, // number = milliseconds delay before onMouseOut
        over: function() {
            $('<div id="fileinfo" />').load('ReadTextFileX.aspx', {filename:'file.txt'},
                function() {
                   $(this).appendTo('#info');
                }
             );
        }, // function = onMouseOver callback (REQUIRED)
        out: function() { $('#info').remove();  } // function = onMouseOut callback (REQUIRED)
    }
    $('#container a').hoverIntent(hiConfig)
}

推荐答案

Use the hoverIntent plugin for jquery: http://cherne.net/brian/resources/jquery.hoverIntent.html

It's absolutely perfect for what you describe and I've used it on nearly every project that required mouseover activation of menus etc...

这种方法有一个问题,一些接口没有"悬停"状态,例如.手机浏览器就像iPhone上的Safari.您可能隐藏了界面或导航的重要部分,无法在这样的设备上打开它.您可以使用特定于设备的CSS来解决此问题.

Jquery相关问答推荐

将搜索面板和服务器端与POST AJAX请求一起使用时出现DataTables错误

如何在Jquery和Laravel中使用请求传递两个参数给Datatable

在 Laravel 中使用 jQuery post 按相关值过滤 Select 选项,如何显示从控制器返回的数据?

Bootstrap 的工具提示在悬停时将表格单元格向右移动一点

如何在jQuery中移动表格行?

.trigger() 与 .click() 中的 jQuery 优势/差异

延迟后运行功能

在没有 jQuery 的情况下在 node.js 上合并或合并 JSON

jQuery用另一个类替换一个类

如何在 jquery 中更新(附加到)href?

停止输入/书写后如何触发输入文本中的事件?

判断 JS 对象中是否存在键

如何删除/更改 JQuery UI 自动完成助手文本?

Backbone.js - 事件,知道点击了什么

在 bootstrap 弹出窗口中包含表单?

在jQuery中获取CSS规则的百分比值

jQuery - 从元素内部 Select 元素

Uncaught TypeError: undefined is not a function on loading jquery-min.js

Drop 事件未在 chrome 中触发

如何让 jQuery 等到效果完成?