开发者

test if display = none

开发者 https://www.devze.com 2023-01-02 20:23 出处:网络
This does not work, should it? Or can you stop the error if another line could do the same: function doTheHighlightning(searchTerms) {

This does not work, should it? Or can you stop the error if another line could do the same:

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

I need to filter rows in a table and color some word. The data has become way to much for the coloring if many words are chosen. So I will try to limit the coloring by only going through the none hidden elements.


If you want to get the visible tbody elements, you could do this:

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

It looks similar to the answer that Agent_9191 gave, but this one removes the space from the selector, which makes it selects the visible tbody elements instead of the visible descendants.


EDIT:

If you specifically wanted to use a test on the display CSS property of the tbody elements, you could do this:

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


Use like this:

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

Hope it helps!


Try this instead to only select the visible elements under the tbody:

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


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


As @Agent_9191 and @partick mentioned you should use

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

or

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

Additionally, since you seem to be applying a class to the highlighted words, instead of using jquery to alter the background for all matched highlights, just create a css rule with the background color you need and it gets applied directly once you assign the class.

.highlight { background-color: #FFFF88; }


You can use the following code to test if display is equivalent to none:

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

精彩评论

暂无评论...
验证码 换一张
取 消