2012-04-24 9 views
0

こんにちは私はスパンのリストのフィルタを作成しようとしていますが、スパンを小文字か無視することに問題があります。 アイデアJavascript tolower/ignoreCase in filter

$("#filterinput2").keyup(function() { 
      var filter = ($(this).val()).toLowerCase(); // get the value of the input, which we filter on 
      console.log("lower filter" + filter); 
      if (filter) {   
       // hide tr's for songs not matching and show tr's for songs matching 
       $(".tonelist").find(".song:not(:contains(filter))").parent().parent().parent().fadeOut("slow"); 
       $(".tonelist").find(".song:contains(filter)").parent().parent().parent().fadeIn(); 
       if (window.console != undefined) { 
        console.log($(".tonelist").find(".song:not(:contains(" + filter + "))").parent().parent().parent().innerHTML); 
       } 

       $(".tonelist").find(".grouptitle:not(:contains(" + filter + "))").parent().fadeOut("slow"); 
       $(".tonelist").find(".grouptitle:contains(" + filter + ")").parent().fadeIn(); 
       if (window.console != undefined) 
        console.log($(".tonelist").find(".grouptitle:not(:contains(" + filter + "))").parent().parent().parent().innerHTML); 
      } else 
      // if input field is empty, show all tr's 
       $(".tonelist").find("tr").fadeIn(); 

      ColorLines(); 
     }); 

答えて

0

各スパンの内容を自分で確認する必要があります。これは、.html()関数を使って、各曲/ grouptitleの内容を文字列として取得することで実現できます。

$("#filterinput2").keyup(function() { 
     var filter = ($(this).val()).toLowerCase(); // get the value of the input, which we filter on 
     console.log("lower filter" + filter); 
     if (filter) {   
      // hide tr's for songs not matching and show tr's for songs matching 
      spans = $(".tonelist").find(".song, .grouptitle") 
      for (s in spans) { 
       el = $(spans[s]); 
       if (el.html().match(new RegExp(filter, "i"))) { 
        el.fadeIn(); 
       } else { 
        el.fadeOut("slow"); 
       } 
      } 
     } else 
     // if input field is empty, show all tr's 
      $(".tonelist").find("tr").fadeIn(); 

     ColorLines(); 
    }); 

理由があることである:(私はそれをテストしていないが)このような何かがうまくいくかもしれない含まれています()CSSセレクタは大文字と小文字が区別され、そしてそれを変更することが私の知っている方法はありません。