JQuery.is (": visible") works in Firefox, but not in Chrome

Question

Possible duplicate:
jquery.is (": visible") does not work in Chrome

I am trying to get all visible elements in an array. It works fine in Firefox, but not in Chrome.

Here is my code:

$.each (t.config.promoInput, function (i, v) { var size = 0; $.each ($(v).find('option'), function (i, v) { $(v).show() // Show all options in <tt>$(v)</tt>. .not(':first-child') // Don't hide <tt>(All)</tt>. .not(':Contains("' + t.config.searchSpanInput.val() + '")') // Don't hide options that match the searchCriteria. .hide(); // Hide everthing that doesn't match or isn't (All). if ($(v).is(":visible")) { size++; } }); }); 

While increasing the size of Firefox, while the size of Chrome remains equal to 0.

EDIT :: Contains my own jQuery library add-on. This is a case-insensitive version: contains.

Answer 1

Hide and show, (enable / disable) settings are poorly supported by the cross-browser (disable / enable). See this question for one possible solution to your problem: jQuery disable SELECT parameters based on selected radio (need support for all browsers)

After you remove the parameters cropped, you can use the length to get the size.

Answer 2

Why don't you just check the "display" property if it is "none" , what it is hidden for, if it "inline" , what it is visible for:

 $.each (t.config.promoInput, function (i, v) { var size = 0; $.each ($(v).find('option'), function (i, va) { $(va).show() // Show all options in <tt>$(v)</tt>. .not(':first-child') // Don't hide <tt>(All)</tt>. .not(':Contains("' + t.config.searchSpanInput.val() + '")') // Don't hide options that match the searchCriteria. .hide(); // Hide everthing that doesn't match or isn't (All). }); //add only visible options if ($(va).css("display") === "inline") { size++; } }); 

Take a look here http://jsfiddle.net/gwbTm/2/ (I tested it in Chrome).
I believe that setting visibility <option> is what creates a problem with browsers (especially with IE)