jQuery on hover事件不起作用

Question

我有一个网站，里面有一些隐藏div的div。我想要做的是当我将鼠标悬停在父div上时显示隐藏的div。我无法使用CSS3 :hover，因为我需要支持ie6。所以我使用了jquery。这对我不起作用。

以下是一个示例： JSFiddle

$('#front-container').on("hover", "#jobs-by-cat .job", function () {
    $(this).find('.hover').toggleClass('hidden');
});

这就是悬停时的样子： JSFiddle

动态更改#jobs-by-cat div，因此必须像这样进行选择。

Answer 1

没有名为hover的事件，.hover()功能是注册mouseenter和mouseleave事件处理程序的快捷方式，因此您需要使用它

$('#front-container').on("mouseenter mouseleave", "#jobs-by-cat .job", function () {
    $(this).find('.hover').toggleClass('hidden');
});

演示：Fiddle

Answer 2

根据.on的jQuery docs：

  

在jQuery 1.8中弃用，在1.9中删除：名称“hover”用作   字符串“mouseenter mouseleave”的简写。它附单   这两个事件的事件处理程序，处理程序必须检查   event.type，用于确定事件是mouseenter还是mouseleave。   不要将“hover”伪事件名称与.hover（）方法混淆，   它接受一个或两个函数

因此您需要替换为mouseenter和mouseleave事件：

$('#front-container').on("mouseenter mouseleave", "#jobs-by-cat .job", function () {
    $(this).find('.hover').toggleClass('hidden');
});

Answer 3

尝试使用“mouseenter”和“mouseleave”事件。

$('#front-container').on("mouseenter mouseleave", "#jobs-by-cat .job", function () {
    $(this).find('.hover').toggleClass('hidden');
});