Question

我有一组动态创建的div框 - 有时会有很多框，有时不会有很多框。它们以3行排列。当我点击一个框时，它会淡出并且旁边的框填满它的空间。

我需要的是给每行中间的一个类“中间” - 我遇到的问题是，当一个框fdesOut时，中间框明显改变。

这是一个证明我的问题的JSfiddle。当你点击一个方框时，如果中间的一个移动，它应该丢失它的类，新的中间框应该获得“中间”类

以下是我目前正在使用的代码：

$('.box:nth-child(3n+2)').addClass('middle');

$( ".box" ).click(function() {
$(this).fadeOut( "slow" );
});

Answer 1

通过可见性过滤你的div并做一些数学运算：

$( ".box" ).click(function() {
    $(this).fadeOut( "slow", function(){
        $( ".middle" ).removeClass("middle");
        $('.box:visible').addClass(function(i){
            if((i-1) % 3 == 0) return 'middle';
        })
    })
});

您可以将addClass参数传递给函数。 i是当前div的索引。

确保在fadeOut发生后调用该函数！

小提琴：http://jsfiddle.net/xmq2x/7/

jQuery将类添加到3组中的中间元素

1 个答案: