Javascript jQuery-为什么我的循环运行了两次？_Javascript_Jquery

Javascript jQuery-为什么我的循环运行了两次？

javascript jquery

Javascript jQuery-为什么我的循环运行了两次？,javascript,jquery,Javascript,Jquery,我有一个循环，它贯穿菜单的第一级LI项。我想检测循环的结束，但是，我得到的打印输出似乎运行了两次以下是我的JS： var numNavItems = $("#navigation > li").size() - 1; $("#navigation > li").each(function(i) { $(this).delay( i * 300 ).animate({ opacity: 1 }, 300); // This runs twice $("#cont

我有一个循环，它贯穿菜单的第一级LI项。我想检测循环的结束，但是，我得到的打印输出似乎运行了两次

以下是我的JS：

var numNavItems = $("#navigation > li").size() - 1;

$("#navigation > li").each(function(i) {

    $(this).delay( i * 300 ).animate({ opacity: 1 }, 300);

// This runs twice
    $("#content").append("<p>Loop number: " + i + " out of " + numNavItems + "</p>");

    if( i == numNavItems) {
        //$("#navigation li").css({ "opacity" : 1 });
        //alert("End! Number of items = " + numNavItems + ". Last item = " + i );

    }

});

非常感谢你的帮助。迈克尔。

检查一下。它可以在每个浏览器上正常工作

可能您在某处调用了它两次，或者您有重复的代码

请注意，这不是在DOM就绪或页面加载时调用它的问题，它不会改变任何东西。有两个元素具有相同的ID内容也不是问题。输出将是4中的0、4中的0、4中的1、4中的1…，而且它只是忽略第二个div

要么检查重复的HTML或JS代码，要么检查调用两次的函数

你应该把你的循环放在一个函数中，并添加console.log'menu loop function'；在您的功能开始时。查看它被调用了多少次。

检查。它可以在每个浏览器上正常工作

可能您在某处调用了它两次，或者您有重复的代码

要么检查重复的HTML或JS代码，要么检查调用两次的函数

你应该把你的循环放在一个函数中，并添加console.log'menu loop function'；在您的功能开始时。查看它被调用了多少次。

我只是怀疑您的代码被调用了两次，可能是因为按钮上的双重绑定或类似的原因。我只是试图复制你的问题，我只有5行。将代码直接附加到当前页面可能会使结果加倍。我建议将$content.append…替换为webkit浏览器或警报下的console.log…并查看是否仍然得到双重结果。如果是这种情况，那么在每个循环中追加一个mess，否则只需调用两次函数。以下是我的虚拟测试片段：

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
$(document).ready(function() {
var numNavItems = $("#navigation > li").size() - 1;
$("#navigation > li").each(function(i) {
    $(this).delay( i * 300 ).animate({ opacity: 1 }, 300);
    // This runs twice
    console.log("<p>Loop number: " + i + " out of " + numNavItems + "</p>");
    if( i == numNavItems) {
        //$("#navigation li").css({ "opacity" : 1 });
       // alert("End! Number of items = " + numNavItems + ". Last item = " + i );
    }
});
});
</script>
</head>
<body>
<ul id="navigation">
                <li class="selected"><a href="./">Home</a></li>
                <li><a href="./portfolio/">Portfolio</a>

                    <ul>
                        <li><a href="#">Cosmos</a></li>
                        <li><a href="#">Remora</a></li>
                        <li><a href="#">Caspian</a></li>
                        <li><a href="#">Megaway</a></li>
                    </ul>
                </li>
                <li><a href="./philosophy/">Philosophy</a></li>
                <li><a href="./about/">About</a></li>
                <li><a href="./contact/">Contact</a></li>
            </ul>
            </body>
</html>

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
$(document).ready(function() {
var numNavItems = $("#navigation > li").size() - 1;
$("#navigation > li").each(function(i) {
    $(this).delay( i * 300 ).animate({ opacity: 1 }, 300);
    // This runs twice
    console.log("<p>Loop number: " + i + " out of " + numNavItems + "</p>");
    if( i == numNavItems) {
        //$("#navigation li").css({ "opacity" : 1 });
       // alert("End! Number of items = " + numNavItems + ". Last item = " + i );
    }
});
});
</script>
</head>
<body>
<ul id="navigation">
                <li class="selected"><a href="./">Home</a></li>
                <li><a href="./portfolio/">Portfolio</a>

                    <ul>
                        <li><a href="#">Cosmos</a></li>
                        <li><a href="#">Remora</a></li>
                        <li><a href="#">Caspian</a></li>
                        <li><a href="#">Megaway</a></li>
                    </ul>
                </li>
                <li><a href="./philosophy/">Philosophy</a></li>
                <li><a href="./about/">About</a></li>
                <li><a href="./contact/">Contact</a></li>
            </ul>
            </body>
</html>

我通过使用元素的：visible伪类解决了这个问题，因为显然，每个元素都在每个元素上循环，不管它是隐藏的还是可见的

$('li:visible').each(function(){

    /* it will loop on the elements which are visible */

});

我通过使用元素的：visible伪类解决了这个问题，因为显然，每个元素都在每个元素上循环，不管它是隐藏的还是可见的

$('li:visible').each(function(){

    /* it will loop on the elements which are visible */

});

这是在dom就绪时调用的吗？对我来说，它似乎只运行一次：提供的脚本可能有外部的东西可能会调用它两次吗？我用jQuery 1.6.2检查了它，它运行在onceThanks，伙计们-我错误地通过一个狡猾的回调函数调用了它两次-我的错。无论如何，感谢您的关注。这是在dom就绪时调用的吗？它对我来说似乎只运行了一次：提供的脚本可能有外部的东西可能会调用它两次吗？我用jQuery 1.6.2检查了它，它在onceThanks上运行-我通过一个不可靠的回调函数错误地调用了它两次-我的错。不管怎样，谢谢你看一下。好的，你的答案没有直接回答，但是它提示我检查我的代码，我在一个函数中有这个片段，这个函数是在一个animate方法的回调函数中执行的。这似乎是问题的根源——不确定原因，可能太复杂了，无法在这里展示。不过，谢谢你对这一点的新鲜眼光。我没有在我的帖子中提到函数wrap，所以我没有更详细的描述也无济于事。再次感谢。没问题，请记住使用大多数浏览器的console.log功能跟踪程序流。您将直接了解您的程序是如何运行的。好的，您的回答没有直接回答，但它提示我检查我的代码，我在一个函数中有这个片段，该函数是在animate方法的回调函数中执行的。这似乎是问题的根源——不确定原因，可能太复杂了，无法在这里展示。不过，谢谢你对这一点的新鲜眼光。我没有在我的帖子中提到函数wrap，所以我没有更详细的描述也无济于事。再次感谢。没问题，请记住使用大多数浏览器的console.log功能跟踪程序流。您将直接了解程序的运行情况。感谢您的帮助。你是对的，它被调用了两次…一个bug o

在我这边。你不是第一个，所以我不能给你答案，但我投了赞成票。希望没问题。再次感谢。谢谢你的帮助。你说得对，它被叫来了两次……我这边有一只虫子。你不是第一个，所以我不能给你答案，但我投了赞成票。希望没问题。再次感谢。