Pourquoi mon caché <tr> n'est-il pas vraiment caché?

Question

J'ai ce simple balisage HTML généré à partir asp classique:

<table> 
    <tr class="trClass"> 
    <td>Hello </td> 
    </tr> 
    <tr class ="trClass"> 
    <td>World!</td> 
    </tr> 
</table> 

Si je mets le tr appartenant Bonjour à cacher() en utilisant Jquery il se cache. Bien! Mais quand j'utilise ce $ ('.trClass: visible'). Each (function() {alert ('visible')}); il montre la sortie 'visible' deux fois.

Pourquoi est-ce?

Mon problème ici est que je filtre une table sur une colonne avec une boîte de sélection. Mais après le filtrage j'ai besoin d'effectuer des calculs sur les lignes visibles dans la table, mais je reçois toutes les lignes maintenant.

Des idées?

/Daniel

Answer 1

Le sélecteur :visible n'a pas tester la propriété de style display, vous voulez utiliser :hidden à la place, the 1.3.2 release notes say:

... si l'affichage CSS de votre élément est "none", ou l'un de ses éléments parent/ancêtre l'affichage de l'élément est "none", ou si la largeur de l'élément est 0 et que la hauteur de l'élément est 0 alors un élément sera comme caché.

Ceux-ci correctement sélectionnez vos lignes visibles:

$('.trClass:not(:hidden)').each(function() { 
    alert('visible'); 
}); 

ou:

$('.trClass').each(function() { 
    if(!$(this).is(':hidden')) { 
     alert('visible'); 
    } 
}); 

ou:

$('.trClass').filter('not:(:hidden)').each(function() { 
    alert('visible'); 
}); 

hide définit le style à display="none". Le release notes pour jQuery 1.3.2 disent aussi:

Dans jQuery 1.3.2 un élément est visible si son navigateur rapporté offsetWidth ou offsetHeight est supérieure à 0.

donc je suppose que dans dans ce cas, le sélecteur :visible ne correspond à rien car les lignes n'occupent aucun espace en fonction des calculs effectués, bien que leur propriété CSS display soit et non définie sur none. À l'inverse, :hidden correspond correctement aux éléments style="display:none", donc le test des éléments non :hidden fonctionne correctement.

Answer 2

Vous ne savez pas si cela compte, mais ne cache pas() définir display: none; et non visible: hidden? Ce qui signifie qu'une ligne cachée est toujours visible, elle n'est simplement pas affichée ...

Answer 3

votre trClass entre probablement en collision avec l'affichage: aucun ensemble .hide(). lorsqu'un tag possède à la fois l'attribut de classe et l'attribut de style sera appliqué. vous devriez surveiller de près votre trClass et en retirer l'affichage.

Answer 4

You've found a legitimate bug. Il est cassé en 1.3.2 mais maintenant fixed in trunk.

According to Resig:

nous attendons déjà le cas de 'tr' qui a le même problème, dans IE

pensé que vous aimeriez savoir ...