标签云过滤器

Question

我有一个包含许多跨度的div，并且每个跨度都包含一个href。

基本上它是一个标签云。我想要做的是在KeyUp事件中过滤标签云的文本框。

任何想法或这是可能的吗？

更新的问题：重置列表以重新开始搜索的最佳方式是什么？

Answer 1

基本上，你想要做的是这样的

$('#myTextbox').keyup(function() { 
    $('#divCloud > span').not('span:contains(' + $(this).val() + ')').hide(); 
}); 

Answer 2

这可能可以在改进和轻量化，但这至少给了能够通过分隔条件您输入隐藏多个标签功能逗号。例如：输入entering this, that, something将隐藏每个跨度。

演示HTML：

<div id="tag_cloud"> 
    <span>this</span> 
    <span>that</span> 
    <span>another</span> 
    <span>something</span> 
    <span>random</span> 
</div> 

<input type="text" id="filter" /> 

演示jQuery的：

function oc(a){ 
    var o = {}; 
    for(var i=0;i<a.length;i++){ 
     o[a[i]]=''; 
    } 

    return o; 
} 

$(function(){ 
    $('#filter').keyup(function(){ 
     var a = this.value.replace(/ /g,'').split(','); 

     $('#tag_cloud span').each(function(){ 
      if($(this).text() in oc(a)){ 
       $(this).hide(); 
      } 
      else { 
       $(this).show(); 
      } 
     }) 
    }) 
})