jQueryライブ検索。すべての文字を確認してください

Question

ライブ検索のためにjqueryライブ検索を使用しました。私はこのhtmlを持っています。人からの多くの名前のリスト。

<ul id="friends" class="friend-selection"> 
    <li> 
     <a href="#" title="Ik nodig deze vriendin uit">  
      <img src="static/img/voorbeeld/vrouw.jpg" width="50" height="50"> 
      <span class="name">Janneke Scheerhoorn</span> 
     </a>   
    </li> 
<ul> 
<input type="text" name="q" value=""> 

私はjqueryライブ検索機能を使用しました。しかし、私はこれに問題があります。ライブ検索では大文字と小文字が区別されます。ライブ検索スクリプトを修正するにはどうすればいいですか？大文字と小文字は区別されません。手伝ってくれてありがとう。ここでは、スクリプトを持っている：

プラグイン：私はこれを使用し、HTMLで

(function($) { 
    var Search = function(block) { 
    this.callbacks = {}; 
    block(this); 
    } 

    Search.prototype.all = function(fn) { this.callbacks.all = fn; } 
    Search.prototype.reset = function(fn) { this.callbacks.reset = fn; } 
    Search.prototype.empty = function(fn) { this.callbacks.empty = fn; } 
    Search.prototype.results = function(fn) { this.callbacks.results = fn; } 

    function query(selector) { 
    if (val = this.val()) { 
     return $(selector + ':contains("' + val + '")');; 
    } else { 
     return false; 
    } 
    } 

    $.fn.search = function search(selector, block) { 
    var search = new Search(block); 
    var callbacks = search.callbacks; 

    function perform() { 
     if (result = query.call($(this), selector)) { 
     callbacks.all && callbacks.all.call(this, result); 
     var method = result.size() > 0 ? 'results' : 'empty'; 
     return callbacks[method] && callbacks[method].call(this, result); 
     } else { 
     callbacks.all && callbacks.all.call(this, $(selector)); 
     return callbacks.reset && callbacks.reset.call(this); 
     }; 
    } 

    $(this).live('keypress', perform); 
    $(this).live('keydown', perform); 
    $(this).live('keyup', perform); 
    $(this).bind('blur', perform); 
    } 
})(jQuery); 

：

(function($) { 
     $(document).ready(function() { 
      $('input[name="q"]').search('#friends li', function(on) { 
      on.all(function(results) { 
       var size = results ? results.size() : 0 
       $('#count').text(size + ' results'); 
      }); 

      on.reset(function() { 
       $('#none').hide(); 
       $('#friends li').show(); 
      }); 

      on.empty(function() { 
       $('#none').show(); 
       $('#friends li').hide(); 
      }); 

      on.results(function(results) { 
       $('#none').hide(); 
       $('#friends li').hide(); 
       results.show(); 
      }); 
      }); 
     }); 
     })(jQuery); 

Answer 1

だからここれます大文字と小文字を区別しない 'Contains'メソッドで編集された最終的なスクリプト。関数 'query'内の 'contains'を 'Contains'に変更したことに注意してください。

(function($) { 
    var Search = function(block) { 
     this.callbacks = {}; 
     block(this); 
    } 

    Search.prototype.all = function(fn) { this.callbacks.all = fn; } 
    Search.prototype.reset = function(fn) { this.callbacks.reset = fn; } 
    Search.prototype.empty = function(fn) { this.callbacks.empty = fn; } 
    Search.prototype.results = function(fn) { this.callbacks.results = fn; } 

    jQuery.expr[':'].Contains = function(element,i,m){ 
     return (element.textContent || element.innerText || "").toUpperCase().indexOf(m[3].toUpperCase())>=0; 
    }; 

    function query(selector) { 
     if (val = this.val()) { 
      return $(selector + ':Contains("' + val + '")');; 
     } else { 
      return false; 
     } 
    } 

    $.fn.search = function search(selector, block) { 
     var search = new Search(block); 
     var callbacks = search.callbacks; 

     function perform() { 
      if (result = query.call($(this), selector)) { 
       callbacks.all && callbacks.all.call(this, result); 
       var method = result.size() > 0 ? 'results' : 'empty'; 
       return callbacks[method] && callbacks[method].call(this, result); 
      } else { 
       callbacks.all && callbacks.all.call(this, $(selector)); 
       return callbacks.reset && callbacks.reset.call(this); 
      }; 
     } 

     $(this).live('keypress', perform); 
     $(this).live('keydown', perform); 
     $(this).live('keyup', perform); 
     $(this).bind('blur', perform); 
    } 
})(jQuery); 

Answer 2

を使用すると、別の方法が含まれて定義する必要があります。

jQuery.expr[':'].Contains = function(element,i,m){ 
    return (element.textContent || element.innerText || "").toUpperCase().indexOf(m[3].toUpperCase())>=0; 
};