Javascript 变量can'；没人看见

对不起，这可能是一个简单的问题。我正在尝试使用jQuery构建我的第一个导航。只要不是“选定”按钮，悬停按钮时背景颜色和文本颜色就会改变。除了文字颜色外，所有这些都很好用。在jQuery中，它无法看到我的循环变量：

function testIndex(navIndex){
        for(i=0; i<=4; i++){
            if(i != navIndex){
                $('#nav a:eq('+i+')').hover(function(){
                    $(this).fadeTo('fast', 0.3, function(){
                        $(this).css('background-color','#ff3520');
                        $('#nav li:eq('+i+')').css('color', '#ffffff');
                    }).fadeTo('fast', 1);
                },
                function(){
                    $(this).fadeTo('fast', 0.3, function(){
                        $(this).css('background-color', '#e8e8e8');
                        $('#nav li:eq('+i+')').css('color', '#ff3520');
                    }).fadeTo('fast', 1);
                });
            };  
        };
    };

无法看到“i”变量。我已经通过插入我自己的变量来测试它，并且它是有效的

有什么建议吗

---

谢谢。

因为您处于循环中，所以需要一个变量范围来保持对处理程序中

i

的引用

function testIndex(navIndex){
    $.each(Array(5), function(i) {
        if(i != navIndex){
            $('#nav a:eq('+i+')').hover(function(){
                $(this).fadeTo('fast', 0.3, function(){
                    $(this).css('background-color','#ff3520');
                    $('#nav li:eq('+i+')').css('color', '#ffffff');
                }).fadeTo('fast', 1);
            },
            function(){
                $(this).fadeTo('fast', 0.3, function(){
                    $(this).css('background-color', '#e8e8e8');
                    $('#nav li:eq('+i+')').css('color', '#ff3520');
                }).fadeTo('fast', 1);
            });
        }
    });
}

---

在JavaScript中，调用函数会产生一个变量作用域，因此我使用

$。每个
用于循环，因为它为每个数组索引调用函数。
已经解释了代码的问题所在（
I
的作用域），并提供了解决方案。还可以看看这个相关的问题：

但是，您可以以不同的方式解决它，完全不使用索引，而是使用DOM遍历，以一种更面向jQuery的方式。我假设您的HTML与此类似：

<ul id="#nav">
    <li><a>...</a></li>
    <li><a>...</a></li>
</ul>

你能详细说明一下“看不见”吗？如果你把
for
语句改为
for（var i=0；iAdd
var
在
i
前面，否则你只能得到最后一个值，因为你的变量是全局的，这个变量看不见。听起来像是惠普Lovecraft的工作。@jli-as-in不能被$（'nav-li:eq（'i+'））使用.css（'color'，'ff3520'）；节。但是，它可以由$（'nava:eq（'+i+'））使用。hover（function（）…完美。谢谢，我认为这是一个范围问题，但我认为我自己把事情复杂化了。
<ul id="#nav">
    <li><a>...</a></li>
    <li><a>...</a></li>
</ul>

function testIndex(navIndex){
    $('#nav a').slice(0,5).not(function(i) { 
        return i === navIndex;
    }).hover(function(){
        $(this).fadeTo('fast', 0.3, function(){
            $(this).css('background-color','#ff3520')
              .closest('li').css('color', '#ffffff');
         }).fadeTo('fast', 1);
    }, function(){
        $(this).fadeTo('fast', 0.3, function(){
            $(this).css('background-color', '#e8e8e8');
              .closest('li').css('color', '#ff3520');
        }).fadeTo('fast', 1);
    });
}