Display partial array value matches from user input
我有一个jquery数组,它有很多值。
我希望用户能够键入一个输入并与屏幕上我的数组显示中的任何内容进行部分匹配。
到目前为止,我已经知道什么时候有一个完整的匹配,我可以打印到页面上。但我不知道如何进行部分比赛。
这是我到目前为止的一把JS小提琴。
以下是我的代码,以防万一:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | var ingredients = ["cheese","chicken","cherries","chick peas","potato"] var input = $('#ingredient-search'); var value = input.val(); var resultsDiv = 'Results for"<span class="results-for"></span>"'; var pressed = false; var resultsFor; var matches; $("#ingredient-search").on("keyup", function() { if(pressed == false ){ $('.append').append(resultsDiv); } pressed = true; resultsFor = $('.results-for'); resultsFor.html($(this).val()); if (jQuery.inArray(resultsFor.html(), ingredients) != -1) { alert(resultsFor.html() + ' is in the array!'); } }); |
有什么想法吗?
像这样的事情应该对你有用:
子字符串搜索
1 2 3 4 | for(var x = 0; x < ingredients.length; x++){ if(ingredients[x].indexOf($("#ingredient-search").val()) > -1) $(".append").append(ingredients[x]+""); } |
小提琴http://jsfiddle.net/benderr/f5use/3/
"从"搜索
1 2 3 4 | for(var x = 0; x < ingredients.length; x++){ if(ingredients[x].indexOf($("#ingredient-search").val()) == 0) $(".append").append(ingredients[x]+""); } |
小提琴http://jsfiddle.net/benderr/f5use/5/
不区分大小写搜索
1 2 3 4 | for(var x = 0; x < ingredients.length; x++){ if(ingredients[x].indexOf(($("#ingredient-search").val()).toLowerCase()) == 0) $(".append").append(ingredients[x]+""); } |
小提琴http://jsfiddle.net/benderr/f5use/6/
这是