0

我有一个 div，里面有 20 个 div。我正在做的是从 div:eq(1) 开始并将其与左边的交换，然后重复 div:eq(2)、div:eq(3) 等并交换到左边。

似乎 DOM 在此之后没有正确更新，因为在此之后它们总是关闭 1。

我想也许在动画完成后克隆 div 会起作用，但它不会。

似乎 DOM 不会实时更新它的结构？ 编辑 很抱歉最初没有提供代码。正如您在第一次交换后看到的那样，它使用“旧”div。

http://jsfiddle.net/vrCUT/

$(function () {


    var currentIndex = 0;
   for (i = 0; i < 20; i++) {
            $("#holder").append('<div class="number">' + i + '</div>');
   }


    function resetDivs(){
    $("#holder div").css("border", "");
    }
    prepareForSwap();
    function prepareForSwap() {
        currentIndex++;
        resetDivs();
        div2 = $("#holder").find("div:eq(" + currentIndex + ")");
        div1 = div2.prev();

        div1.css("border", "3px solid blue");
        div2.css("border", "3px solid red");
        setTimeout(swap, 2000);

    }

    function swap() {
        div1.animate({
            left: "+=25"
        }, 2000, function () {
        });


        div2.animate({
            left: "-=25"
        }, 2000, function () {
            if(currentIndex < 20){
            setTimeout(prepareForSwap,2000);
            }
        });


   }
    );
4

1 回答 1

0

从div:eq(0)直到开始div:eq(19)

于 2013-08-02T07:31:58.713 回答