javascript - 通过 json 实时搜索以查看给定的字符串是否在数组中

Question

$(document).ready(function () {
    var names = ["nick", "nicky", "nickyy", "nick23", "nickfe09", "nickf9", "jim1", "jimbo2"];

    $.each(names, function (index, value) {
        $('<span>').html(value + '<br>').appendTo('#div');
    });

    $('#input').change(function (event) {
        $('#div > span:contains("' + $('#input').val() + '")').css('background', 'red');
    });
});

<div id="div"></div>
<input type="text" id="input">

你好再次stackoverflow！

我有一个带有用户名的字符串。我想将它们显示在一个表格中（或者在这个例子中，只是一个列表），然后只显示其中的 10 个（最终列表中将有大约 200 个名称）。例如，当用户在输入字段中输入内容时nic，我希望它过滤其余内容并显示 10 个最匹配的用户名。

我已经尝试了上面的设置，但这没有用。你们能帮帮我吗？

问候

小提琴：http: //jsfiddle.net/4wZ2L/5/

Answer 1

请参阅此工作演示。

$(document).ready(function () {
    var names = ["nick", "nicky", "nickyy", "nick23", "nickfe09", "nickf9", "jim1", "jimbo2"];
    $.each(names, function (index, value) {
        $('<span>').html(value + '<br>').appendTo('#div');
    });
    $('#input').on("change keyup", function (event) {
        $('#div > span').css('background','');
        $('#div > span:contains("' + $(this).val() + '")').css('background', 'red');
    });
});

我所做的只是：

1. 使它除了#input响应keyup事件之外change。
2. spans在确定哪些匹配之前清除所有格式。
3. 在您实际更改内容的行中，我更改input.val为$(this).val(). 变量input未定义。

希望这可以帮助！