在Jquery中的数组内循环和调用数组

我试图在JSON中调用数组中的一个变量，我希望当人们搜索一个城市时，一个模式会出现在屏幕上，模式出现了，但值不会加载JSON的结构

    "title": "",
    "start": "",
    "tags": "",
    "imageurl": "",
    "products": [
      {
        "name":"this is the value I want to call",
        "url": "",
        "time":"",
        "location":""
      }
    ]
   $("#search").change(function () {
       var selectedCity = $("#searchcity").val();
        $.getJSON('events.json', 
       function (data) {
       render(selectedCity, data);
        });
    });

    function render(selectedCity, data) {
        $(".order-details-table").empty();
        $(data).each(function (i, v) {                
            if (selectedCity == 'all' || v.products.name == selectedcity)  {
                if (v.products)
                    $(v.products).each(function (index, p) {
                        $(".order-details-table").append('<tr><td class="o-box-name"><a name="detailsevent">' + p.name + '</a></td><td class="o-box-name">' + v.title + '<br><small>' + p.time + '</small><small>&nbsp' + p.location + '</small></td><td><a href="' + p.url + '" class="cancel-del-text" target=_"blank">Register!</a></td></tr>');
                    });
            }                
        });
    }

html

---

你这边的打字错误。selectedCity被错误输入为selectedCity，其searchcity更改功能而不是search

应该是

v.products.name == selectedCity

改良JS

jQuery(document).ready(function(){
       jQuery("#searchcity").change(function () {
       var selectedCity = $("#searchcity").val();
        jQuery.getJSON('events.json', 
       function (data) {
             render(selectedCity, data);
        });
    });


    });

     function render(selectedCity, data) {
        $(".order-details-table").empty();
        $(data).each(function (i, v) {                
            if (selectedCity == 'all' || v.products.name == selectedCity )  {
                if (v.products)
                    $(v.products).each(function (index, p) {
                        console.log(p);
                    $("#order-details-table").append('<tr><td class="o-box-name"><a name="detailsevent">' + p.name + '</a></td><td class="o-box-name">' + v.title + '<br><small>' + p.time + '</small><small>&nbsp' + p.location + '</small></td><td><a href="' + p.url + '" class="cancel-del-text" target=_"blank">Register!</a></td></tr>');
                });
        }                
    });
}

---

如果selectedCity='all'| | v.products.name==selectedCity{，则行中存在问题

v.products是一个数组，因此请尝试使用v.products.name==selectedCity检查是否选择了任何产品名称

一个可能提供帮助的功能是

some方法测试数组中是否至少有一个元素通过了所提供函数实现的测试

渲染函数的修复程序：

function render(selectedCity, data) {
    $(".order-details-table").empty();
    if(!v.products){
        return;
    }
    var fnFilterCity = function(product){
        return product.name == selectedCity;
    }
    $(data).each(function (i, v) {                
        if (selectedCity == 'all' || v.products.some(fnFilterCity)) {
            $(v.products).each(function (index, p) {
                $("#order-details-table").append('<tr><td class="o-box-name"><a name="detailsevent">' + p.name + '</a></td><td class="o-box-name">' + v.title + '<br><small>' + p.time + '</small><small>&nbsp' + p.location + '</small></td><td><a href="' + p.url + '" class="cancel-del-text" target=_"blank">Register!</a></td></tr>');
            }); 
        }
    });  
}

---

您可以参考下面的代码，这可能会给您一个解决方案的提示

var arr={title:abc， 开始：， 标签：， imageurl:， 产品：[ { name：这是我要调用的值， url:url1， 时间:00.00.00,， 地点：xyz } ]}; var产品=arr[“产品”]； $searchcity.changefunction{ var selectedCity=$searchcity.val； RenderSelected城市、产品 }; 函数renderselectedCity，数据{ $.order-details-table.empty； $data.eachfunction i，v{ $.order-details-table.append； }; } 按城市筛选： 选择一个城市 芝加哥 丹佛 全部的

---

如果是您的答案，请将其标记为答案：-

jQuery(document).ready(function(){
       jQuery("#searchcity").change(function () {
       var selectedCity = $("#searchcity").val();
        jQuery.getJSON('events.json', 
       function (data) {
             render(selectedCity, data);
        });
    });


    });

     function render(selectedCity, data) {
        $(".order-details-table").empty();
        $(data).each(function (i, v) {                
            if (selectedCity == 'all' || v.products.name == selectedCity )  {
                if (v.products)
                    $(v.products).each(function (index, p) {
                        console.log(p);
                    $("#order-details-table").append('<tr><td class="o-box-name"><a name="detailsevent">' + p.name + '</a></td><td class="o-box-name">' + v.title + '<br><small>' + p.time + '</small><small>&nbsp' + p.location + '</small></td><td><a href="' + p.url + '" class="cancel-del-text" target=_"blank">Register!</a></td></tr>');
                });
        }                
    });
}

function render(selectedCity, data) {
    $(".order-details-table").empty();
    if(!v.products){
        return;
    }
    var fnFilterCity = function(product){
        return product.name == selectedCity;
    }
    $(data).each(function (i, v) {                
        if (selectedCity == 'all' || v.products.some(fnFilterCity)) {
            $(v.products).each(function (index, p) {
                $("#order-details-table").append('<tr><td class="o-box-name"><a name="detailsevent">' + p.name + '</a></td><td class="o-box-name">' + v.title + '<br><small>' + p.time + '</small><small>&nbsp' + p.location + '</small></td><td><a href="' + p.url + '" class="cancel-del-text" target=_"blank">Register!</a></td></tr>');
            }); 
        }
    });  
}