选择包含一些隐藏选项但未显示任何选项的框

Question

Example of this issue on JSFiddle

在Chrome中，最新的，Ubuntu。

使用jQuery隐藏option元素中的select元素时，它使用display: none;和display: inline来改变可见性。我遇到过这样一种情况：当大多数option元素被隐藏时，那些应该可见的元素也不会出现。此时从列表中删除一个选项只会显示另一个选项，但会显示箭头按钮，就好像问题是select下拉列表的高度一样。

我一直无法确定选择或类似限制内隐藏选项的数量是否有限制;有没有人遇到过这个？

实施例

• Hide/show class example显示当一个块被注释掉时它是如何工作的
• Two block CSS example显示一组选项如何工作，另一组选项不工作。

Answer 1

利用jQuery添加或删除<option />元素。所有浏览器See W3C都不支持类和样式属性。不知道你是如何传递或评估数据的，但这是一种潦倒的方式：

$('select[name="price"] option[value="whatever"]').remove();
$('select[name="price"]').append(($('<option>', { value : key }).text(value));