在多选列表框中使用Quicksilver样式进行jQuery实时搜索

我试图让John Resig的jQuery Live Search与Quicksilver Style一起使用选择多表单控件。 他的代码基于John Nunemaker的工作开发他的quicksilver.js代码。

我遇到的问题是，在选择框中只有Firefox支持选项值上的.hide（），我无法找到IE，Safari，Opera和Chrome的快捷方法。

这是一个例子，我已经列出了John R的代码，但你需要抓住quicksilver.js并自己在本地托管它。 同样，这在Firefox中很有用，但对rows.hide（）的调用在其他浏览器上没有任何作用。

我已经尝试将标签包装在div中并隐藏但没有运气。

有任何想法吗？

        $(document).ready(function() { $('#q').liveUpdate('#posts').focus(); }); jQuery.fn.liveUpdate = function(list){ list = jQuery(list); if ( list.length ) { // Changed 'li' to 'option' below var rows = list.children('option'), cache = rows.map(function(){ return this.innerHTML.toLowerCase(); }); this .keyup(filter).keyup() .parents('form').submit(function(){ return false; }); } return this; function filter(){ var term = jQuery.trim( jQuery(this).val().toLowerCase() ), scores = []; if ( !term ) { rows.show(); } else { rows.hide(); cache.each(function(i){ var score = this.score(term); if (score > 0) { scores.push([score, i]); } }); jQuery.each(scores.sort(function(a, b){return b[0] - a[0];}), function(){ jQuery(rows[ this[1] ]).show(); }); } } };    
 
 

  The Well-Designed Web Welcome John Nunemaker Sidebar Creative: The Next Steps The Web/Desktop Divide 2007 in Review Don't Complicate the Solution Blog to Business Single Line CSS The Great Divide What's in a Name?  
 
   

Answer 1

最好的方法是添加和删除DOM中的选项。

像这样：

编辑：

需要对arrays“全部”而非行进行评分。