Jquery 显示从json到下拉列表的值

我有一个像这样的josn数据

{
  "VMs":[
    {
      "ID":"VM-WIN7-32",
      "OS":"Windows 7-32",
      "ADAPTER":[{"ID":"adap01", "name":"Linksys Wireless-G USB Network Adapter", "paths":"D:\\VirtualMachines\\Win7_X86_VM-001\\Win7_X86_VM-001.vmx","SNAPSHOT":"Wi-Fi-Test"}],
      "DUIConfig":[{"ID":"dui01", "name":"DGI","description":"dui description"}]    

    }, {
      "ID":"VM-WIN764",
      "OS":"Windows 7-64",
      "ADAPTER":[{"ID":"adap02", "name":"222Linksys Wireless-G USB Network Adapter", "paths":"E:\\VirtualMachines\\Win7_X86_VM-001\\Win7_X86_VM-001.vmx","SNAPSHOT":"Wi-Fi-Test"}],
      "DUIConfig":[{"ID":"dui02", "name":"2ddDGI","description":"2 dui description"}]   

    }
  ]

}

我有3个下拉列表。当选择操作系统

“Windows 7-32”

相应的

适配器

名称和

DUIConfig

名称时，应将其加载到相应的下拉列表中， 我正在使用以下代码。当从下拉列表中选择第一个

os

时，它正在工作；当选择第二个

os

时，它不工作。获取错误信息

TypeError: data.VMs[i].ADAPTER[i] is undefined


...option value="' + data.VMs[i].ADAPTER[i].ID + '">' + data.VMs[i].ADAPTER[i].names.

代码

$（“#ops”）.change（函数（）{
var adapter=“”，dui=“”；
所选变量=$（this.val（）；
$.getJSON（'/json/data.json'，函数（数据）{
$.each（data.VMs，函数（i）{
if（data.VMs[i].ID==选中）{
适配器+=''+数据.VMs[i].适配器[i].名称+''；
dui+=''+data.VMs[i].DUIConfig[i].names+''；
}
});
$（'#adapter'）.html（adapter）；
$（'dui'）.html（dui）；
});
});
$.getJSON（'/json/data.json'，函数（数据）{
var os='选择'；
变量适配器='选择'；
$.each（data.VMs，函数（i）{
os+=''+data.VMs[i].os+''；
适配器+=''+数据.VMs[i].适配器[i].名称+''；
});
$（'#ops'）.html（os）；
$（'#adapter'）.html（adapter）；
});
}

htmlcode

 <tr>
            <td width="200px">
              Operating Systems : 
            </td>
            <td colspan="2">
              <select id="ops" class="longcombo">
              </select>
            </td>
          </tr>

          <tr>
            <td width="200px">
             Adapter :
            </td>
            <td colspan="2">
              <select id="adapter" class="longcombo">
              </select>
            </td>
          </tr>
 <tr>
            <td width="200px">
             DUI Config :
            </td>
            <td colspan="2">
              <select id="dui" class="longcombo">
              </select>
            </td> <td colspan="2" id="showdes">

            </td>
          </tr>

操作系统：
适配器：
酒后驾车配置：

但此代码将加载任何内容

我的代码怎么了

---

“

您需要使用

data.VMs[i].ADAPTER[0]

，因为

ADAPTER

数组只有一个值，与

DUIConfig

也一样

adapter += '<option value="' + data.VMs[i].ADAPTER[0].ID + '">' + data.VMs[i].ADAPTER[0].names + '</option>';  

adapter+=''+data.VMs[i].适配器[0].名称+''；

另外，您将获得当前对象作为每个处理程序的第二个参数，因此不需要在每个处理程序内部使用索引

$("#ops").change(function () {
    var adapter = [],
        dui = [];
    var selected = $(this).val();
    $.getJSON('/json/data.json', function (data) {
        //you will get the current VM as the second parameter, so no need to access it using index again
        $.each(data.VMs, function (i, vm) {
            if (vm.ID === selected) {

                adapter.push('<option value="' + vm.ADAPTER[0].ID + '">' + data.VMs[i].ADAPTER[0].names + '</option>');
                dui.push('<option value="' + vm.DUIConfig[0].ID + '">' + data.VMs[i].DUIConfig[0].names + '</option>');

            }
        });

        $('#adapter').html(adapter.join(''));
        $('#dui').html(dui.join(''));
    });
});

$（“#ops”）.change（函数（）{
变量适配器=[]，
酒后驾车=[]；
所选变量=$（this.val（）；
$.getJSON（'/json/data.json'，函数（数据）{
//您将获得当前VM作为第二个参数，因此无需再次使用索引访问它
$.each（data.VMs，function（i，vm）{
如果（vm.ID==选中）{
adapter.push（“”+data.VMs[i]。适配器[0]。名称+“”）；
dui.push（“”+data.VMs[i].DUIConfig[0].names+“”）；
}
});
$（'#adapter'）.html（adapter.join（''）；
$（'#dui'）.html（dui.join（''）；
});
});

---

演示：

在选择第二个操作系统获取'data.VMs[i]时，没有出现相同的错误。适配器[i]未定义'Now get with this code.…

ADAPTER.push（''+vm.ADAPTER[0].names+''）；dui.push（“”+vm.DUIConfig[0]。名称+“”）获取`data.VMs[i]。适配器[i]未定义`@Sush
data.VMs[i]。适配器[i]。名称
再次错误。。它应该是
vm.ADAPTER[0]。name
-不应该再次使用
i
，键是
name
而不是
names
$("#ops").change(function () {
    var adapter = [],
        dui = [];
    var selected = $(this).val();
    $.getJSON('/json/data.json', function (data) {
        //you will get the current VM as the second parameter, so no need to access it using index again
        $.each(data.VMs, function (i, vm) {
            if (vm.ID === selected) {

                adapter.push('<option value="' + vm.ADAPTER[0].ID + '">' + data.VMs[i].ADAPTER[0].names + '</option>');
                dui.push('<option value="' + vm.DUIConfig[0].ID + '">' + data.VMs[i].DUIConfig[0].names + '</option>');

            }
        });

        $('#adapter').html(adapter.join(''));
        $('#dui').html(dui.join(''));
    });
});