我正在尝试从下拉列表中选择值并且相应于该值,列表框应该被填充并且我从我的json获取值。在添加ist框之前,我的下拉列表工作正常,但现在没有任何内容显示在下拉列表中,甚至在列表框中...下面是我的javascript ...请我需要你的帮助......
$(document).ready(function () {
$.getJSON("data.json",function(obj) {
var jsObject = $.parseJSON(obj);
var usedNames = [];
$.each(obj, function(key, value) {
if (usedNames.indexOf(value.name) == -1) {
$("#dropdown1").append("<option value=" + key + ">" + value.name + "</option>");
usedNames.push(value.name);
}
$('<option>', {
text: 'Select your Option',
value: '',
selected: 'selected',
disabled: 'disabled'
}).appendTo('#dropdown1');
$.each(jsObject, function (index, value) {
$('<option>', {
text: value['name'],
value: index
}).appendTo('#dropdown1');
});
$('<option>', {
text: 'Select your List Option',
value: '',
selected: 'selected',
disabled: 'disabled'
}).appendTo('#listbox');
$('#dropdown1').change(function () {
$('#listbox').empty();
$('<option>', {
text: 'Select your List Option',
value: '',
selected: 'selected',
disabled: 'disabled'
}).appendTo('#listbox');
var selection = $('#dropdown1 :selected').text();
$.each(jsObject, function (index, value) {
if (value['name'] === selection) {
$('<option>', {
text: value['attr001'],
value: 'attr001'
}).appendTo('#listbox');
$('<option>', {
text: value['attr002'],
value: 'attr002'
}).appendTo('#listbox');
$('<option>', {
text: value['attr003'],
value: 'attr003'
}).appendTo('#listbox');
}
});
});
我的json文件
[{
"name": "obs",
"date": "1458834026000",
"attr001": "brs1",
"attr002": "crs1",
"attr003": "drs1",
}, {
"name": "hid",
"date": "1458774000000",
"attr001": "ffrs1",
"attr002": "grrs1",
"attr003": "mno1",
}, {
"name": "qwe",
"date": "1425744000000",
"attr001": "klm1",
"attr002": "wer1",
"attr003": "iop1",
}, {
"name": "rty",
"date": "1458774000000",
"attr001": "yrs1",
"attr002": "qws1",
"attr003": "prs1"
}]