jQuery 悬停不起作用

发布于 2024-10-06 02:31:44 字数 466 浏览 1 评论 0原文

当我尝试这个时。

<ul id="sub_navigation"><li>A</li><li>B</li></ul>

当我将鼠标悬停在 sub_navigation 时，像这样的 jQuery 悬停

$(function() {
    $('#sub_navigation').hover(function() {
        $(this).addClass('hovered');
    },
    function() {
    $(this).removeClass('hovered');
    });

   alert($('#sub_navigation').is('.hovered'));

});

总是返回 false。

有什么问题吗？

谢谢

原文

When I try this.

<ul id="sub_navigation"><li>A</li><li>B</li></ul>

with jQuery hover like this

$(function() {
    $('#sub_navigation').hover(function() {
        $(this).addClass('hovered');
    },
    function() {
    $(this).removeClass('hovered');
    });

   alert($('#sub_navigation').is('.hovered'));

});

always return false when I hover at sub_navigation.

there is something wrong?

thanks

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

谁把谁当真 2024-10-13 02:31:44

此处返回 false 是正常的，因为您是在页面加载时发出警报，而不是在悬停时发出警报。例如，这将返回 true：

$(function() {
    $('#sub_navigation').hover(function() {
        $(this).addClass('hovered');
        alert($('#sub_navigation').is('.hovered'));
    }, function() {
        $(this).removeClass('hovered');
    });
});

您可以在此处测试。

但请记住，如果您这样做只是为了样式化，那么使用 :hover CSS 伪类将适用于除 IE6 之外的所有浏览器（没有 JavaScript）：

#sub_navigation:hover { color: red; }

在这里测试一下。

Returning false is normal here, since you're alerting when the page loads, instead of when you hover. For example this would return true:

$(function() {
    $('#sub_navigation').hover(function() {
        $(this).addClass('hovered');
        alert($('#sub_navigation').is('.hovered'));
    }, function() {
        $(this).removeClass('hovered');
    });
});

You can test it here.

Keep in mind though, if you're doing this just for styling, using the :hover CSS pseudo-class will work in all browsers except IE6 here (with no JavaScript):