arrays - 如何在 for 循环中动态选择 JSON 数组中的元素？

问题描述

我创建了一个网页，它基本上是一个搜索表单。用户必须在文本字段中输入城市名称并单击搜索按钮；只要此类字符串包含在特定城市列表中，用户就可以单击另一个按钮来搜索该城市中的酒店。

我正在利用两个 JSON 文件来做到这一点：前者来自 API 搜索，后者是我自己创建的静态文件；为了显示来自两者的信息，我编写了两个for loop函数并使用了.append()两次该方法，以便将两个 JSON 文件的信息依次显示为相同的tbody，请参见下面的代码：

var readHotel = function () {
    $.ajax({
        url: "http://localhost/prove/pagine_bianche/searchpb?client=pbbrowsing&version=4.0&device=evo&pagesize=25&output=json&lang=it&typedwhat=hotel&what=hotel&where=" + encodeURIComponent($("#inlineFormInputCitta").val()),
        dataType: "json",   

        success: function (data) {
            $("#tbody2").empty();    

            for (let i = 0; i < data.results.length; i++) {
                let hotel = data.results[i];

                $("#tbody2").append("<tr><td>" + hotel.lastname + "</td><td>" + hotel.phones[0].number + "</td></tr>");
                $("#tabella2").show();
                $("#thead2").show();
            }

            for (let i = 0; i < lowCostHotels.LOW_COST_Pilgrim_accomodation.length; i++) {


                    $("#tbody2").append("<tr><td>" + lowCostHotels.LOW_COST_Pilgrim_accomodation[i].name + "</td><td>" + lowCostHotels.LOW_COST_Pilgrim_accomodation[i].city + "</td></tr>")

            }
                $("#hotel").prop("disabled", false);
        }  
    });
};

我之前创建了一个lowCostHotels包含 JSON 文件全部内容的变量：

var readLowCostAccomodation = function () {

    $.ajax({
        dataType: "json",
        url: "http://localhost/prove/low_cost_hotels.json",
        success: function (data) {
            console.log("ajax call readLowCostAccomodation() has been activated");
            lowCostHotels = data;
        }
    })
};

该代码有效，即正确显示所需的信息。

我现在需要做的是选择要显示的第二个JSON文件的信息，即：我要显示用户搜索过的特定城市的信息。我需要保留for loop函数来循环 JSON 数组的所有元素，但我只需要显示其中一个。更准确地说，第二个 JSON 文件的结构如下（为了简洁，我只写了一部分）：

{
  "LOW_COST_Pilgrim_accomodation": [

    {
      "name": "A Taberna Potami",
      "city": "TOPLECCA",
      "region": "Tuscany",
      "type": "Low Cost Pilgrim Accomodation",
      "tappa": "Pavia-Lucca"
    },
    {
      "name": "Ostello Castello del Piagnaro",
      "city": "PONTREMOLI",
      "region": "Tuscany",
      "type": "Low Cost Pilgrim Accomodation",
      "tappa": "Pavia-Lucca"
    }
  ]
}

上面的 JSON 数组有 2 个元素。每个元素都提供有关两个不同城市 TOPLECCA 和 PONTREMOLI 的酒店的信息。数组的所有元素都需要循环（在本例中为 2），但我只想显示那些与在搜索表单中键入的字符串相对应的元素：如果用户键入“TOPLECCA”，我想显示第一个元素给出的信息；如果他输入“PONTREMOLI”，我想输入第二个。

为了做到这一点，我想我需要使用如下所示的($("#inlineFormInputCitta").val()类似内容，因为这inlineFormInputCitta是给输入表单/文本字段的 ID：

if ($("#inlineFormInputCitta").val() === lowCostHotels.LOW_COST_Pilgrim_accomodation[i].city) {}

...然后在大括号中写入一些函数来告诉浏览器采用特定的

lowCostHotels.LOW_COST_Pilgrim_accomodation[i].name

我正在考虑创建新变量以将 JSON 文件的键“城市”与 if 语句中的键“名称”（酒店）相关联，但我不确定我的方向是否正确。 .

有什么建议吗？

我在下面添加了 if 语句，但它不起作用：

for (let i = 0; i < lowCostHotels.LOW_COST_Pilgrim_accomodation.length; i++) {

                if ($("#inlineFormInputCitta").val() === lowCostHotels.LOW_COST_Pilgrim_accomodation[i].city);

                {
                    var city = $("#inlineFormInputCitta").val();
                    var entry = lowCostHotels.LOW_COST_Pilgrim_accomodation.find(function(entry) {
                        return entry.city === city;
                        return entry.name === name;
                    });

                    $("#tbody2").append("<tr><td>" + entry.name + "</td><td>" + entry.city + "</td></tr>")
                }
            }

我收到以下错误：

标签： arraysjsonfor-loopappendplaceholder

是的，您需要获取城市名称，我假设它来自您在代码中使用的input元素。id$("#inlineFormInputCitta").val()

添加if您提到的作品，或者您可以find用来查找条目而根本没有for循环，例如：

var city = $("#inlineFormInputCitta").val();
var entry = lowCostHotels.LOW_COST_Pilgrim_accomodation.find(function(entry) {
    return entry.city === city;
});
if (entry) {
    // Use `entry.name`, etc. here
} else {
    // There was no match
}

arrays - 如何在 for 循环中动态选择 JSON 数组中的元素？

问题描述

解决方案

推荐阅读