jQuery: Je besoin de quelque chose comme « : visible » qui fonctionne même si le parent est affichage = aucun

Question

J'ai une liste où les éléments sont cachés pour de multiples raisons, chacun correspondant à un à-dire de classe CSS:

<style> 
    .filteredOut { display: none; } 
    .somethingElse { display : none; } 
    ... 
</style> 

Je souhaite appliquer des classes css en alternance via .filter(':even').addClass('even') mais uniquement aux classes visibles. Le problème est que le parent est caché quand cela se produit donc .filter(':visible') renvoie 0 éléments. J'ai besoin de quelque chose comme .filter(':visibileEventIfParentIsNot')

De plus, je préfère ne pas avoir à appeler une fonction avec ceci à chaque fois que j'appelle une fonction qui change ce qui est visible dans une liste. Cela peut être un rêve de pipe, mais est-il un moyen de le faire ala live() ou quelque chose de similaire? Je suis ouvert aux idées du mur.

Answer 1

Pour .filter(':visibileEventIfParentIsNot') vous pouvez écrire votre propre fonction de filtre, comme ceci:

.filter(function() { 
    return $(this).css("display") != 'none'; 
}) 

Notez que cela ne couvre pas la visibilité, seulement les cas jQuery traditionnels comme .hide(), qui est effectivement le même que .css('display', 'none').

Mais si vous faites alterner les styles de ligne et tout à coup, a montré un nombre impair d'éléments, ce ne serait pas regarder à droite, je pense que vous êtes mieux de faire l'application .filter(':even') lorsque la visibilité de quelque chose change (peut-être l'événement .resize() avec .resize() plugin?).

Answer 2

Utilisez des classes pour contrôler vos événements. Si vous voulez filtrer les éléments cachés, ajoutez les classes nécessaires aux enfants. Quand ils deviennent visibles, le navigateur va refaire le css.