使用 jQuery 循环遍历 ul li 并存储当前导航项答案

【问题标题】：Looping over ul li's using jQuery and storing current nav item使用 jQuery 循环遍历 ul li 并存储当前导航项
【发布时间】：2010-09-27 12:00:02
【问题描述】：

我正在循环遍历我的 UL 中的第一组 li a 标签并获取高度，以便如果 a > span > span 文本跨越两三行，我可以提供不同的背景图像。

我需要能够将这些特定按钮存储在一个数组中，这样当我将鼠标悬停在它们上时，带有双行文本的当前跨度会接收到不同的背景图像。

这就是我所拥有的，我不知道从这里去哪里。我将不胜感激。

   var doubleLineButtons = new Array();

$("div.subSectNav .RadPanelBar ul.rpRootGroup > li.rpItem > a").each(function (i) {

    if ($(this).height() > 35) {

        doubleLineButtons.push($(this))

        // here I need to access any possible menu items if the lines have wrapped and deliver a different background image
        doubleLineButtons[i].hover(function(){
            // change the background image of this button
            (this).css('background', 'url("/App_Themes/2010a/images/background_nav_sub_left_double.png") no-repeat scroll 0 0 transparent');
        },
        function(){
            // remove the background image from this button
        });

    }

});

非常感谢！

【问题讨论】：

你为什么要把按钮放在一个数组中，然后再把它拿出来改变背景？在将其放入数组之前，您可能只想将其作为绑定直接添加到 $(this)，在 jquery api 中查找绑定函数。

标签： jquery arrays loops

【解决方案1】：

如果您只想更改背景图像，我不明白为什么需要将它们存储在数组中。 http://jsfiddle.net/h6GTW/ 的以下工作示例应该让您沿着正确的路线前进。

$('li').each(function() {
    if ($(this).height() > 35) {
        $(this).hover(function() {
            $(this).css('background', 'red');
        }, function() {
            $(this).css('background', 'white');
        });
    }
});?

【讨论】：

要删除背景，请使用$(this).css('background', 'none');
哇...爱 jsFiddle Blair。以前没见过！谢谢你上面的例子。我现在就试试看！
像炸弹一样工作！谢谢大家！