在用户在文本字段中键入时显示基于特定数组键的数组值

Displaying array value based on a certain array key as a user type in a text field

本文关键字：数组 于特定 显示 用户 文本 字段      更新时间：2023-09-26

我查看了从用户输入中显示部分数组值匹配项，并尝试获得相同的结果。

区别在于数组格式。我希望搜索文本值与数组键、名称匹配。

无论我在文本字段中键入什么，它都会显示"找不到匹配项！"并且我永远无法显示名称。似乎玩家[x].name.indexOf((无法识别。如何显示名称？

这是小提琴

    var players = [
                { "id" : "23012",
                  "name" : "Scott",
                  "first" : "Stve",
                  "last" : "Scott" },
                { "id" : "22904",
                  "name" : "Phillips, A",
                  "first" : "Adam",
                  "last" : "Phillips"},
                { "id" : "45783",
                  "name" : "Phillips, T",
                  "first" : "Tom",
                  "last" : "Phillips" },
                { "id" : "54762",
                  "name" : "Scobery",
                  "first" : "Don",
                  "last" : "Scobery" },
                { "id" : "78903",
                  "name" : "Phillip",
                  "first" : "Roger",
                  "last" : "Phillip"}
              ]
$("#searchField").on("keyup", function() {
    $(".append").empty();
    if($("#searchField").val() != ""){
        for(var x = 0; x < players.length; x++){
            if(players[x].name.indexOf(($("#searchField").val()).toLowerCase()) == 0){
               $(".append").append(players[x].name+"<br>");
             } else {
              $(".append").html("no match found!");
             }
        }
    }
});

更新小提琴

您在第一次否定搜索时会覆盖所有搜索结果。因为您附加了追加结果，所以一开始没有发现您用 .html(( 指令杀死了所有附加的子项。只是那个错误。我不确定您的小写用途，但这是另一回事。

    var players = [{
    "id": "23012",
        "name": "Scott",
        "first": "Stve",
        "last": "Scott"
}, {
    "id": "22904",
        "name": "Phillips, A",
        "first": "Adam",
        "last": "Phillips"
}, {
    "id": "45783",
        "name": "Phillips, T",
        "first": "Tom",
        "last": "Phillips"
}, {
    "id": "54762",
        "name": "Scobery",
        "first": "Don",
        "last": "Scobery"
}, {
    "id": "78903",
        "name": "Phillip",
        "first": "Roger",
        "last": "Phillip"
}]
$("#searchField").on("keyup", function () {
    var found = false;
    $(".append").empty();
    if ($("#searchField").val() != "") {
        for (var x = 0; x < players.length; x++) {
            if (players[x].name.indexOf($("#searchField").val()) >= 0) {
                found = true;
                $(".append").append(players[x].name + "<br>");
            }
        }
        if (!found) {
           $(".append").html("no match found");
        }
    }
}); // searchField on

要使搜索完全不区分大小写：

if (players[x].name.toLowerCase().indexOf($("#searchField").val().toLowerCase()) == 0)

垃圾邮件小写。(对对象和输入(

相关文章：