Search Through a list By jquery (with case insensitive)
我正试图通过搜索框搜索列表。这是我的HTML:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <input type="text" id="query" value=""/> <li> Cars </li> <li> bars </li> . . |
这是我拥有的jquery代码:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | var abbrs = {}; $('ol#abbreviations li').each(function(i){ abbrs[this.firstChild.nodeValue] = i; }); $('#query').focus().keyup(function(e){ if(this.value.length >= 2){ $('ol#abbreviations li').hide(); var filterBy = this.value; for (var abbr in abbrs) { if (abbr.indexOf(filterBy) !== -1) { var li = abbrs[abbr]; $('ol#abbreviations li:eq('+li+')').show(); } } } else { $('ol#abbreviations li').show(); } if(e.keyCode == 13) { $(this).val(''); $('ol#abbreviations li').show(); } }); |
我的代码运行良好,但区分大小写。例如,如果我输入"cars",它将过滤列表,但是如果我输入"cars",它将不起作用。那么,如何使这个jquery搜索具有插入性呢?我试图更改
您需要将
1 2 3 4 | var filterBy = this.value.toLowerCase(); ... if (abbr.toLowerCase().indexOf(filterBy) !== -1) { ... |
也看到这个问题