jQuery 鼠标悬停 / 鼠标移出问题

Question

我有一个页面显示元素列表（项目） - 它们是动态绘制的，因此是“实时”的。当用户将鼠标悬停在项目上时，我希望它们切换到“on”类，然后当他们滚出时（mouseout），项目会恢复正常。下面的代码行可以打开项目，但无法关闭。有什么建议吗？

$('.item').live('mouseover', function(){$(this).switchClass('item','item_on', 500);});
$('.item_on').live('mouseout', function(){$(this).switchClass('item_on','item', 500);});

谢谢！

- slawder

Answer 1

$('.item').live('mouseover',
function(){$(this).addClass('item_on');});
$('.item').live('mouseout',
function(){$(this).removeClass('item_on');});

此外，我认为要使 switchClass 正常工作，您需要在 jquery 之后但在您的脚本之前包含 jQuery UI。可能发生的情况是鼠标在延迟创建 .item_on 元素之前就已经离开了 .item 元素。

另外，我认为您正在寻找的不是延迟的 switchclass，因为它可能无法触发 live 事件处理程序，而是尝试使用 http://cherne.net/brian/resources/jquery.hoverIntent.html，并结合上述 addClass / removeClass 使用。

- CodeJoust