1

所以基本上我试图在悬停在子菜单的元素上时保持打开向下箭头的顶级类别图像。我想通过 jQuery 在悬停功能上执行此操作,但是我无法终生获得选择器来定位子菜单项。

这是我试图运行的代码:

$(document).ready(function() {
    $('.sub ul > li').hover(function() {
        $(this).parents('a.sub').attr('src', 'images/DownArrow.png');
},
function(){
     $(this).parents('a.sub').attr('src', 'images/DownArrowOff.png');
   }); 
});

在此下拉菜单中:

http://www.seth-duncan.com/Test/TestMenu.html

但正如我所说,我无法确定选择器来定位那些子菜单项,因此我可以更改图像的 src。

这必须通过 jQuery 而不是通过 CSS 完成(相信我,我知道它有效,但不是我必须完成此任务的方式)

感谢您的任何帮助。

-赛斯

4

2 回答 2

2

我认为动态添加图像的事实会干扰 jQuery 找到它们。除非您将事件与live()我认为他们错过了。

也就是说,这就是我如何让它工作的。

$(document).ready(function(){
    var downArrow    = '/Test/images/DownArrow.png';
    var downArrowOff = '/Test/images/DownArrowOff.png';

    $("#menu li a.sub").hover(function () {
        $(this).find('img').attr('src',downArrow);
    }, function () {
        $(this).find('img').attr('src',downArrowOff);
    });
    $("#menu li ul").hover(function () {
        $(this).parents('li:has(a)').children('a.sub').find('img').attr('src', downArrow);
    }, function () {
        $(this).parents('li:has(a)').children('a.sub').find('img').attr('src', downArrowOff);
    });
});
于 2009-06-25T01:39:46.353 回答
2

问题在于您用来到达 li 以悬停的选择器。您的 $('.sub ul > li') 选择器正在查找具有 sub 类的元素内的 ul 元素。您的 ul 元素实际上是子类的兄弟。将您的选择器更改为 $('.sub ~ ul > li') 这将正确定位您的所有 li。

现在,使用 artlung 发布的内容,您用于恢复箭头图像的选择器应如下所示:

$(this).parents('li:has(a)').children('a.sub').find('img')

获得图像后,您可以随意更改属性。

于 2009-06-25T17:34:39.517 回答