jquery - div - prueba si display=none

show jquery

Question

Esto no funciona, ¿verdad? O puede detener el error si otra línea pudiera hacer lo mismo:

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" });
}

Necesito filtrar filas en una tabla y colorear algunas palabras. Los datos se han convertido en mucho para el color si se eligen muchas palabras. Así que trataré de limitar la coloración yendo solo a través de ninguno de los elementos ocultos.

Answer 1

Como @ Agent_9191 y @partick mencionaron, deberían usar

$(''tbody :visible'').highlight(myArray[i]); // works for all children of tbody that are visible

o

$(''tbody:visible'').highlight(myArray[i]); // works for all visible tbodys

Además, dado que parece estar aplicando una clase a las palabras resaltadas, en lugar de usar jquery para alterar el fondo de todas las coincidencias combinadas, simplemente cree una regla css con el color de fondo que necesita y se aplicará directamente una vez que asigne la clase.

.highlight { background-color: #FFFF88; }

Answer 2

Intente esto en su lugar para seleccionar solo los elementos visibles debajo del tbody :

$(''tbody :visible'').highlight(myArray[i]);

Answer 3

Puede usar el siguiente código para probar si la display es equivalente a none :

if ($(element).css(''display'') === ''none'' ){ // do the stuff }

Answer 4

Si desea obtener los elementos tbody visibles, puede hacer esto:

$(''tbody:visible'').highlight(myArray[i]);

Se parece a la respuesta que dio Agent_9191 , pero esta elimina el espacio del selector, lo que hace que seleccione los elementos tbody visibles en lugar de los descendientes visibles.

EDITAR:

Si desea utilizar específicamente una prueba en la propiedad CSS de display de los elementos tbody , puede hacer esto:

$(''tbody'').filter(function() {
     return $(this).css(''display'') != ''none'';
}).highlight(myArray[i]);

Answer 5

Use esto:

if( $(''#foo'').is('':visible'') ) {
    // it''s visible, do something
}
else {
    // it''s not visible so do something else
}

¡Espero eso ayude!

Answer 6

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