0

我有通过 ajax 进入页面的数据字符串。采用以下格式

[{"servername":"svrA"},{"servername":"svrB"},{"servername":"svrC"},{"location":"locA"},{"location":"locB"},{"location":"locC"}]

我想用数据填充两个选择框。

我尝试了以下伪代码的不同变体：

for each item in the json string
if obj == servername
   add to selectbox Server
if obj == location
   add to selectbox Location

任何想法将不胜感激。谢谢。

4

2 回答 2

1

有几种方法可以做到这一点，并且取决于您的代码将来可能会如何发展，一些解决方案可能比其他解决方案稍好或更灵活，但由于我没有这样的知识，这里有一个关于如何做到这一点的示例香草JS。

JSFIDDLE

var data = [
        {"servername":"svrA"},
        {"servername":"svrB"},
        {"servername":"svrC"},
        {"location":"locA"},
        {"location":"locB"},
        {"location":"locC"}
    ],
    selects = {
        servername: document.getElementById('servername'),
        location: document.getElementById('location')
    }, 
    i = 0,
    len = data.length,
    item, prop, val;

for (; i < len; i++) {
    prop = 'servername' in (item = data[i])? 'servername' : 'location';
    val = item[prop];
    selects[prop].add(new Option(val, val), null);
}

如果您计划为多个选择框使用相同类型的数据结构，而不是对selects引用元素的对象进行硬编码，您还可以使用动态select拉取选择并使用通用方法解析引用。idfor inselect

于 2013-08-25T21:32:17.967 回答
1 
var stuff = [{"servername":"svrA"},{"servername":"svrB"},{"servername":"svrC"},{"location":"locA"},{"location":"locB"},{"location":"locC"}];

var elems = {
    "servername": jQuery('#select-server'),
    "location": jQuery('#select-location')
};

stuff.forEach(function(item){
    for(var selectName in elems){
        if(typeof item[selectName] != 'undefined'){
            var val = item[selectName];
            elems[selectName].append(jQuery('<option/>').val(val).html(val));
        }
    }
});

不是forEach旧版浏览器不可用。上面的代码只是供您使用的示例。

于 2013-08-25T21:05:04.120 回答