Php 无法使用JS/JQ从JSON文件返回值以动态填充选项框

我正试图为一个网站写一个基本的转换程序。分类列表相当广泛，在网上进行了大量搜索之后，最好的选择似乎是使用JSON和Jquery，这两种对我来说都是相当新的

其目的是使用下拉菜单将值传递给PHP变量，具体取决于选择的变量“类别”。在每个类别中都有子类别，然后在每个类别中都有各种转换单元

例如，从菜单中选择“基本”，子类别为“温度”。单位将是C、F、K等。然后用户可以输入一个值，单击按钮，瞧

然而……a；我希望这是可行的，b；我对JSON和jQ部分有问题

JSON的一个示例：

{
    "category" : "temp",
    "conversions":
    [{
        "value": "degC",
        "name" : "degC"
    },
    {
        "value": "kelvin",
        "name" : "kelvin"
    }],

    "category" : "area",
    "conversions":
    [{
        "value": "sqInch",
        "name" : "sqInch"
    },
    {
        "value": "sqYard",
        "name" : "sqYard"
    }]
}

我在代码上尝试了许多不同的选项和变体，以尝试访问和返回结果。我能得到的最好结果就是一大堆[object object]结果，或者在下面的示例中，最后一个类别显示得很好

<script>
    $.getJSON('JSON/conversionJSON.json', function(data){

        var output="<ul>";

        for (var i in data.conversions){
            output+="<li>Name: " + data.conversions[i].name + " :Value: "
            + data.conversions[i].value +"</li>";
        }

        output+="</ul>";
        document.getElementById("testJSON").innerHTML=output;
    });
</script>

$.getJSON（'JSON/conversionJSON.JSON'，函数（数据）{
var输出=“
”；
for（数据转换中的var i）{
输出+=“
名称：”+数据。转换[i]。名称+”：值：
+数据。转换[i]。值+“
”；
}
输出+=“
”；
document.getElementById（“testJSON”）.innerHTML=output；
});

有什么明显的东西我遗漏了吗？我需要这是动态的，所以不完全确定我将如何实现这一点，但如果我可以得到一个工作，然后希望我可以建立在它。我们衷心接受您的任何建议、帮助或建议

谢谢。

{
    {
    "sEcho": "1",
    "iTotalRecords": 77,
    "iTotalDisplayRecords": 77,
    "aaData" : [
                    {
                "DT_RowId": "_79",
                "DT_RowClass": "orp",
                "0": "",
                "1": "<a href='/app_dev.php/orp/79'></a>",
                "2": "",
                "3": "",
                "4": "",
                "5": "Unknown",
                "6": "<a href='/app_dev.php/orp/79'><img src='/bundles/porotcore/images/icons/pencil.png' alt='Show' title='Show' /></a><a href='/app_dev.php/orp/79/disable' class='ajax'><img src='/bundles/porotcore/images/icons/cog_delete.png' alt='Disable' title='Disable' /></a>"
            },                    {
                "DT_RowId": "_78",
                "DT_RowClass": "orp disabled",
                "0": "",
                "1": "<a href='/app_dev.php/orp/78'>CONSEILLERS INACTIFS</a>",
                "2": "",
                "3": "",
                "4": "",
                "5": "",
                "6": "<a href='/app_dev.php/orp/78'><img src='/bundles/porotcore/images/icons/pencil.png' alt='Show' title='Show' /></a><a href='/app_dev.php/orp/78/enable' class='ajax'><img src='/bundles/porotcore/images/icons/cog_go.png' alt='Enable' title='Enable' /></a>"
            }
]
}

and in twig file,
{% spaceless %}
{
    "sEcho": "{{ sEcho }}",
    "iTotalRecords": {{ iTotalRecords }},
    "iTotalDisplayRecords": {{ iTotalDisplayRecords }},
    "aaData" : [
        {% for orp in orps %}
            {
                "DT_RowId": "{{ '_' ~ orp.id }}",
                "DT_RowClass": "orp{{ orp.inactive ? ' disabled' : '' }}",
                "0": "",
                "1": "<a href='{{ path('orp_show', { id: orp.id }) }}'>{{ orp.name }}</a>",
                "2": "{{ orp.customerId ? orp.seminarCustomer.getName : '' }}",
                "3": "{{ orp.telephone }}",
                "4": "{{ orp.fax }}",
                "5": "{{ orp.cityId ? orp.city.name : '' }}"            }
{% if not loop.last %},{% endif %}
        {% endfor %}
    ]
}
{% endspaceless %}


*I am not sure but use of i inside loop is required
for (var i in data.conversions){
         output = i.sth;`enter code here`
}

My json data and twig file may help you*

“sEcho”：“1”，
“iTotalRecords”：77，
“iTotalDisplayRecords”：77，
“aaData”：[
{
“DT_RowId”：“_79”，
“DT_RowClass”：“orp”，
"0": "",
"1": "",
"2": "",
"3": "",
"4": "",
“5”：“未知”，
"6": ""
},                    {
“DT_RowId”：“_78”，
“DT_RowClass”：“orp已禁用”，
"0": "",
"1": "",
"2": "",
"3": "",
"4": "",
"5": "",
"6": ""
}
]
}
在细枝文件中，
{%spaceless%}
{
“sEcho”：“{{sEcho}}”，
“iTotalRecords”：{{iTotalRecords}}，
“iTotalDisplayRecords”：{{iTotalDisplayRecords}}，
“aaData”：[
{orp%中orp的%s}
{
“DT_RowId”：“{{{{}~orp.id}”，
“DT_RowClass”：“orp{{orp.inactive？'disabled'：'}}”，
"0": "",
"1": "",
“2”：“{orp.customerId？orp.seminarCustomer.getName:”“}}”，
“3”：“{orp.telephone}”，
“4”：“{orp.fax}”，
“5”：“{orp.cityId？orp.city.name:”“}}”
{%if-not loop.last%}，{%endif%}
{%endfor%}
]
}
{%endspaceless%}
*我不确定，但需要使用I内部循环
for（数据转换中的var i）{
output=i.sth；`在这里输入代码`
}
我的json数据和细枝文件可能会对您有所帮助*

这是我在我的一个项目中所做的，首先，您使用的JSON模式应该有所改变。您当前的模式没有将不同的

类别

放入不同的JSON

对象

，因此我提出了这个新模式。这样使用它的好处是，只需调用

数据['categoryName']

这是一个

JSON:

然后，javascript部分可以很容易地使用，如下所示：

<script>
$.getJSON('JSON/conversionJSON.json', function(data){
    var list=$("<ul />");
    $.each(data, function(key, conversions){
        $.each(conversions, function(index, conversion) {
            $("<li>Name: " + conversion.name + " :Value: " + conversion.value + "</li>").appendTo(list);
        });
    });
    $("#testJSON").html(output);
});
</script>

$.getJSON（'JSON/conversionJSON.JSON'，函数（数据）{
变量列表=$（“
”）；
$.each（数据、函数（键、转换）{
$.each（转换、函数（索引、转换）{
$（“
名称：“+conversion.Name+”：值：“+conversion.Value+”
”）。附录（列表）；
});
});
$（“#testJSON”）.html（输出）；
});

在JSON的顶级中有重复的属性名，这是行不通的。它们会互相覆盖。你确定它不是顶级数组吗？这就解释了为什么最后一个总是被输出。我认为它应该是一个数组。但不确定如何。请将顶级数组设置为与转换数组类似的数组。或者将顶层设置为属性为类别名称、值为转换的对象。@Barmar-我刚刚尝试按照您的建议修改JSON文件，但仍有困难。我现在没有输出。你能更新上面的JSON来表达你的意思吗？看看face的回答，他使用的是我描述的第二种方法。谢谢你，再次感谢你，特别是在小提琴不工作的时候帮我省去了荷马式的挠头时刻：）哈哈，是的，这是一个逻辑上的失败。。很抱歉。很高兴我能帮上忙快速问：为什么在这个例子中使用elem？我偶然发现了一些建议使用替代方案的帖子。使用您的示例，我的下拉列表运行良好。我正在使用：

if（key==”）{$（“#from”）.append（“”+conversion.name+“”）；$（“#to”）.append（“”+conversion.name+“”）

其中basic是所选子菜单的变量。只是不想在继续之前出错。哦，这只是一个变量，不再使用了。它应该已经被编辑过了。只需使用

$（“
名称：“+conversion.Name+”：值：“+conversion.Value+”
”）。追加到（列表）；

或

$（列表）。追加(
名称：“+conversion.Name+”：值：“+conversion.Value+”
”；

也可以。。

<script>
$.getJSON('JSON/conversionJSON.json', function(data){
    var list=$("<ul />");
    $.each(data, function(key, conversions){
        $.each(conversions, function(index, conversion) {
            $("<li>Name: " + conversion.name + " :Value: " + conversion.value + "</li>").appendTo(list);
        });
    });
    $("#testJSON").html(output);
});
</script>