php - JSON 下拉列表未正确填充

Question

我很难使用 JSON 填充下拉列表，这是脚本

function ajax_get_json(){
    var results = document.getElementById("results");
    var hr = new XMLHttpRequest();
    hr.open("GET", "json.php", true);
    hr.setRequestHeader("Content-type", "application/json");
    hr.onreadystatechange = function() {
        if(hr.readyState == 4 && hr.status == 200) {
            var data = JSON.parse(hr.responseText);
            results.innerHTML = "";     
        for (var obj in data) {
           if (data.hasOwnProperty(obj)) {
                    results.innerHTML +="<option>"+ data.l_name +"</option>";
                }
            }
        }
    }
    hr.send(null);
    results.innerHTML = "requesting...";
}

PHP 生成有效的 JSON：

{
    "l_id": [
        "24231",
        "24309",
        "24310",
        "24232"
    ],
    "l_group_id": [
        "001",
        "002",
        "003",
        "999"
    ],
    "l_name": [
        "001 - All Students",
        "002 - All Staff",
        "003 - All Residents",
        "999 - Test List"
    ]
}

我只想显示 l_name 作为选项。

这里的问题是所有值都插入到同一个选项中。我知道循环是错误的，但我无法让另一个循环工作。主要目标是编写：

<option value="l_id"> l_name</option>

我希望你们中的一个人能指出我正确的方向。

Answer 1

如果这是你想要的

<option value="24231">001 - All Students</option>
<option value="24309">002 - All Staff</option>
<option value="24310">003 - All Residents</option>
<option value="24232">999 - Test List</option>

你可能想这样做

var html='';
for (var i in data.l_id) {
    html +="<option value='" + data.l_id[i] + "'>"+ data.l_name[i] +"</option>";
}
results.innerHTML=html; // faster to re-write html once than per iteration