jQuery“visible”不在所有浏览器，但在Firefox中工作 [英] jQuery "visible" doesn't work in all browsers, but in Firefox

问题描述

我制作了一个非常简单的小提琴，这里，您可以在不同的浏览器中查看。

它只能在Firefox中使用。换句话说， $（'＃select-tag-id选项：visible'）似乎在其他浏览器中不起作用。怎么了？是否是一个jQuery错误？

代码是：

  ; select id ='items'> 
< option value ='1'style ='display：none;'>一个< / option> 
< option value ='1'style ='display：block;'>两个< / option> 
< option value ='1'style ='display：block;'> Three< / option> 
< option value ='1'style ='display：none;'>四< / option> 
< / select> 
  

且JavaScript（jQuery代码）是：

  $（function（）{
 alert（$（'＃items option：visible'）。length）; 
}）; 
  

解决方案

这不是一个jQuery错误 - 浏览器差异。

IE不会让您在选项元素上设置 display：none http://stackoverflow.com/questions/2324250/style-display-none-doesnt-work-on-option-tags-in-chrome-but-it-does-in-firefo\">style.display='none'

如果你在FF和IE中查看你的 fiddle ，你会看到< select> 仍然包含IE中的所有四个元素，但只有两个在FF中，而不管jQuery是否存在。

解决方案可能是实际删除元素，并在需要时替换。

I've made a very simple fiddle here, and you can check it out in different browsers.

It only works in Firefox. In other words, seems that $('#select-tag-id option:visible') doesn't work in other browsers. What's wrong? Is it a jQuery bug?

The code is:

<select id='items'>
    <option value='1' style='display: none;'>One</option>
    <option value='1' style='display: block;'>Two</option>
    <option value='1' style='display: block;'>Three</option>
    <option value='1' style='display: none;'>Four</option>
</select>

and the JavaScript (jQuery code) is:

$(function(){
    alert($('#items option:visible').length);
});

解决方案

It's not a jQuery bug - just (yet another) browser difference.

IE won't let you set display:none on option elements (style.display='none' doesnt work on option tags).

If you look at your fiddle in both FF and IE, you'll see that the <select> still contains all four elements in IE, but only two in FF, regardless of jQuery being present.

The solution would probably be to actually remove the elements and replace when needed.

这篇关于jQuery“visible”不在所有浏览器，但在Firefox中工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！