试图隐藏选项列表中的选项..不适用于chrome和ie

我有一个选择列表，有很多选项。 根据某些输入，我想隐藏选择列表中的几个选项。 为了隐藏选择列表中的选项，我写了jquery之类的

$('#selectlist1 option').each(function(){ $(this).hide(); }) 

但是这段代码似乎只适用于firefox，而且它不适用于chrome和ie。 如果我写的话

 $('#selectlist1').hide(); 

它适用于所有浏览器。 我应该看哪个指针？

Answer 1

以下是使用新选项按需重建选择列表的相对简洁的方法。 这适用于动态插入的选项（IE和Chrome在显示和隐藏方面存在问题）

 $().ready(function() { //store a reference var select = $('#myselect'); }); function rebuild_select(arr_new_options) { var parent = select.parent(); select.empty(); var clone = select.clone(); select.remove(); for(var x=0; x < arr_new_options.length; x++) { clone.append(arr_new_options[x]); } parent.append(clone); select = clone; } 

Answer 2

您无法隐藏单个选项元素x-browser。 唯一的解决方案是使用仅包含您希望显示的选项的新元素替换选择。

看到这个其他问题

Answer 3

对于那些不得不在受影响的那些版本中处理隐藏选项元素的人，我在这里发布了一个解决方法，它不会克隆或删除选项，而是围绕它们包装，这可以说更容易处理：

http://work.arounds.org/issue/96/option-elements-do-not-hide-in-IE/