jquery hide（）在chrome中不起作用

我使用jquery弹出对话框，在这个对话框中我有输入和选择框，我想在选择框中隐藏一些选项，它在ff中工作，但在chrome中没有工作。

  aa bb cc dd  

 var clients = new Array(); clients[2] ='aa'; clients[3] ='bb'; clients[4] ='cc'; clients[5] ='dd'; function search(val) { for ( var i in clients) { if (clients[i].toLowerCase().search(val.toLowerCase()) == -1) { $("#cl_sel_l").find("#c_" + i).hide(); } else { $("#cl_sel_l").find("#c_" + i).show(); } } } 

Answer 1

display: none （这是jQuery的hide()函数对匹配元素的作用）不能以可靠的跨浏览器方式用于option元素。 相反，您需要从DOM中删除它们，然后在搜索后将它们重新添加。

这有点棘手，因为您需要存储原始订单。 我很想删除不匹配，然后恢复。 像这样的东西：

 var clients = new Array(); clients[2] ='aa'; clients[3] ='bb'; clients[4] ='cc'; clients[5] ='dd'; var restore; function search(val) { $('#cl_sel_l').html(restore); for ( var i in clients) { if (clients[i].toLowerCase().search(val.toLowerCase()) == -1) { $("#c_" + i).remove(); } } } $(function() { restore = $('#cl_sel_l').html(); }); 

看到这个jsFiddle

Answer 2

jQuery中的.hide()函数通过应用CSS display: none规则来工作。 此规则不适用于元素。

我建议改用.detach()函数。 这允许您从DOM中删除一个元素，但它也保留了以后使用.appendTo()将其重新放回的能力。

在调用search(val)函数之前，在框中创建一个包含所有元素的数组。 然后，遍历每个元素并分离您想要隐藏的元素。