test si display = none

Cela ne fonctionne pas, devrait-il? Ou pouvez-vous arrêter de l'erreur si une autre ligne pourrait faire de même:

function doTheHighlightning(searchTerms) {
    //loop through input array of search terms
    myArray = searchTerms.split(" ");
    for(i=0;i<myArray.length;i++)
    {
        //works. this line works if not out commented. Will highlight all words, also in the hidden elements
        //$('tbody').highlight(myArray[i]);

        //not working when trying to skip elements with display none...
        $('tbody').css('display') != 'none').highlight(myArray[i]);
    }

    //set background to yellow for highlighted words
    $(".highlight").css({ backgroundColor: "#FFFF88" });
}

J'ai besoin de filtrer les lignes dans une table et la couleur de certains mots. Les données a devenir façon beaucoup plus pour le coloriage si de nombreux mots sont choisis. Je vais donc essayer de limiter la coloration par la aucun éléments cachés.

InformationsquelleAutor Tillebeck | 2010-06-04

jquery

44

Si vous voulez obtenir le visible tbody éléments, vous pourriez faire ceci:
```
$('tbody:visible').highlight(myArray[i]);
```
Elle ressemble à la réponse que Agent_9191 a donné, mais celui-ci supprime l'espace dans le sélecteur, ce qui le rend sélectionne le visible tbody éléments au lieu de le visible descendants.

EDIT:

Si vous souhaitez utiliser un test sur le display propriété CSS de la tbody éléments, vous pourriez faire ceci:
```
$('tbody').filter(function() {
     return $(this).css('display') != 'none';
}).highlight(myArray[i]);
```
- Salut. La tbody:visible est le tour est joué très bien. Pouvez rechercher une énorme quantité de données et de mettre en évidence que le texte affiché à l'écran. Grand.
- Seulement alors, vous comprenez, un "espace" dans un sélecteur est un important opérateur. Cela signifie que vous êtes à la recherche d'un descendant. Donc tbody:visible recherche tbody éléments qui sont visible, tandis que tbody :visible recherche descendants de tbody qui sont :visible. Bonne chance! 🙂
InformationsquelleAutor user113716
43

Utiliser comme ceci:
```
if( $('#foo').is(':visible') ) {
    //it's visible, do something
}
else {
    //it's not visible so do something else
}
```
Espère que cela aide!
- Pas de meilleure pratique, mais je pense que c'est la meilleure façon pour les débutants.
- Cela fonctionne très bien pour slideToggle et IE8 car IE considère que le rembourrage à la hauteur de #justSayin
- Quelle est la meilleure pratique ici?
InformationsquelleAutor Zuul
5

Essayez plutôt ceci à sélectionner uniquement les éléments visibles sous la tbody:
```
$('tbody :visible').highlight(myArray[i]);
```
- Pour une raison quelconque, il ne fonctionne pas. Lors de la suppression de l'espace entre tbody et :visible (tbody:visible), puis il fait le travail. Je ne peux pas dire si il doit fonctionner (j'ai peut-être certains buggy logiciel en cours d'exécution, ne sais pas). Mais merci beaucoup pour votre réponse. Désolé, mais j'ai marqué patricks réponse, même si c'était presque un clone de la vôtre 😉
InformationsquelleAutor Agent_9191

$('tbody').find('tr:visible').hightlight(myArray[i]);

InformationsquelleAutor jAndy

1

Comme @Agent_9191 et @partick mentionné que vous devez utiliser
```
$('tbody :visible').highlight(myArray[i]); //works for all children of tbody that are visible
```
ou
```
$('tbody:visible').highlight(myArray[i]); //works for all visible tbodys
```
En outre, puisque vous semblez être l'application d'une classe à la mise en surbrillance des mots, au lieu d'utiliser jquery pour modifier l'arrière-plan de tous appariés faits saillants, il suffit de créer une règle css avec la couleur d'arrière-plan dont vous avez besoin et il est appliqué directement une fois que vous assigner la classe.
```
.highlight { background-color: #FFFF88; }
```
- Super. Merci pour l'explication. Cela peut expliquer pourquoi seule la deuxième œuvres (visible tbodys). Et oui. CSS qui devrait aller dans le fichier CSS et de ne pas être définis dans les différents fichiers js. À la fois pour la performance mais aussi pour la conception des gars de ne pas être frustré 🙂 de le faire.
InformationsquelleAutor Gabriele Petrioli
1

Vous pouvez utiliser le code suivant pour tester si display est équivalent à none:
```
if ($(element).css('display') === 'none' ){
    //do the stuff
}
```
- Bienvenue DONC! Lors de l'affichage de code dans votre réponse, il est utile d'expliquer comment votre code résout les OP de problème 🙂
InformationsquelleAutor notoxics

Vous devez vous connecter pour publier un commentaire.