1

jsFiddle（只是一个给你问题想法的例子）

我被这个愚蠢的事情困住了，非常感谢我能得到的任何帮助。我有一个固定宽度的无序列表，里面有多个列表项。这些列表项是动态填充的。

由于用户在页面上的操作，其中一些元素可能被设置为display:none从视图中隐藏。目前，我正在margin-right使用选择器应用于除每 4 个元素之外的元素li:not(:nth-child(4n)){}。现在的问题是，当这些元素中的一些被设置隐藏时display: none，nth-child选择器仍然会考虑隐藏的元素，因为它们仍然在标记中。这会导致样式有点混乱。

如小提琴所示，增加 ul 的宽度将不起作用。有什么方法可以实现我想要的，而不必从列表中删除这些列表项。

问候

4

1 回答 1

1

虽然只迭代元素可能会更好，但这里有一个有趣的方法：

function reMargin(){
    $("li").css("margin-right", 10);
    $("li:visible").filter(":odd:odd").css("margin-right", 0);
}

jQuery(document).ready(function(){
    jQuery('#set-display').on('click', function(){
        jQuery('#set-this').addClass('display-none');
        reMargin();
    });

    reMargin();
});

http://jsfiddle.net/PrgTQ/2/

:odd:odd实际上返回每 4 个元素。

于 2013-11-10T00:40:14.493 回答