Question

在文档就绪时，我有一个被调用的函数（下面），但它只会增加一次然后无限循环，我做了什么导致这个？

var initNavTransition = function (ELs, n, c) {
    console.log("n: "+n+ ". c: "+c+ ". ELs.length: "+ ELs.length);
    if (typeof variable === 'undefined' || !variable)
        c = 0;
    if (c < ELs.length) {
        if(c > 0)
            ELs[c-1].className = ELs[n-1].className.replace('hover', '');
        ELs[c].className += 'hover';
        c++;
        console.log('increment c: '+c);
        setTimeout(function() {
            initNavTransition(ELs, n, c);
        }, 250);
    }
};

$(document).ready(function(){
    var navELs = document.querySelectorAll('nav li');
    initNavTransition(navELs, navELs.length);
    });

HTML：

<nav>
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</nav>

Answer 1

我认为你没有正确传递或初始化c。

也许这就是：

if (typeof variable === 'undefined' || !variable)

应该是这个（涵盖两种情况并引用c）：

if (!c)

或者，或许更好，您可以在第一次调用函数时将c作为0传递：

$(document).ready(function(){
    var navELs = document.querySelectorAll('nav li');
    initNavTransition(navELs, navELs.length, 0);
});

Answer 2

我不知道你为什么不用c定义调用initNavTransition;但是你的变量检查应该是对c的检查：

http://jsfiddle.net/7xwMr/1/

var initNavTransition = function (ELs, n, c) {
    console.log("n: "+n+ ". c: "+c+ ". ELs.length: "+ ELs.length);
    if (!c)
        c = 0;
    if (c < ELs.length) {
        if(c > 0)
            ELs[c-1].className = ELs[n-1].className.replace('hover', '');
        ELs[c].className += 'hover';
        c++;
        console.log('increment c: '+c);
        setTimeout(function() {
            initNavTransition(ELs, n, c);
        }, 250);
    }
};

$(document).ready(function(){
    var navELs = document.querySelectorAll('nav li');
    initNavTransition(navELs, navELs.length);
    });

试图每个元素每四分之一秒运行一次函数，为什么我的计数不会递增？

2 个答案: