値、名前、またはIDによるjQueryフィルタ入力？値は

Question

ですが、テキストボックスに入力するときにリスト項目をフィルタリングできるjQueryスクリプトがあります....ただし、タグの横にあるテキストのみをフィルタリングします...

このスクリプトは入力の値、特にボタンをフィルタリングするようにしますか？私のhtmlファイルの先頭で

：ここ

<script type="text/javascript" src="js/jquery.liveFilter.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() 
{ 
    $(ul#filter_me').liveFilter('slide'); 
}); 
</script> 

がテキストボックスである：ここで

<input type="text" class="filter" name="liveFilter" /> 

はリストである：

<ul id="filter_me"> 
<li><input type="button" value="John Slater" /></li> 
<li><input type="button" value="Matt Bold" /></li> 
<li><input type="button" value="Bob Cool" /></li> 
</ul> 

私が入力した場合...ジョン、私は価値としてジョンジョンスレーターとのボタンが表示されます。ここで

<input type="button" value="John Slater" /> 

外部のjQueryファイルさ：

(function (a) { 
    a.fn.liveFilter = function (d) { 
     var c = a(this); 
     var g; 
     if (a(this).is("ul")) { 
      g = "li" 
     } else { 
      if (a(this).is("ol")) { 
       g = "li" 
      } else { 
       if (a(this).is("table")) { 
        g = "tbody tr" 
       } 
      } 
     } 
     var e; 
     var b; 
     var f; 
     a("input.filter").keyup(function() { 
      f = a(this).val(); 
      e = a(c).find(g + ':not(:Contains("' + f + '"))'); 
      b = a(c).find(g + ':Contains("' + f + '")'); 
      if (d == "basic") { 
       e.hide(); 
       b.show() 
      } else { 
       if (d == "slide") { 
        e.slideUp(500); 
        b.slideDown(500) 
       } else { 
        if (d == "fade") { 
         e.fadeOut(400); 
         b.fadeIn(400) 
        } 
       } 
      } 
     }); 
     jQuery.expr[":"].Contains = function (j, k, h) { 
      return jQuery(j).text().toLowerCase().indexOf(h[3].toLowerCase()) >= 0 
     } 
    } 
})(jQuery); 

任意の助けいただければ幸いです。

ありがとう:)

Answer 1

あなたは:Containsセレクターを微調整する必要があります。このようなもの：

jQuery.expr[":"].Contains = function (j, k, h) { 

    // get children that have a "value" attribute 
    // (added sort-of handling for <select> elements) 
    var m = jQuery(j).children('[value], select > option[value]'); 

    return m.length 

     // children were found, base the check on the value 
     ? m.filter(function() { 
       return this.value && 
         this.value.toLowerCase().indexOf(h[3].toLowerCase()) >= 0; 
      }).length > 0 

     // otherwise, base on the "innerText" 
     : jQuery(j).text().toLowerCase().indexOf(h[3].toLowerCase()) >= 0; 
} 

私は説明のためにコードをコメントしました。

これはfiddleでテストできます。

---

注：これは絶対にoptmizedされていない、それは完全に（入力以外の[ボタン]）の要素のすべてのタイプでは動作しないかもしれませんが、それはあなたのアイデアを提供します。ここでは、オープン引用符欠落している