Javascript 用JSON数据填充多个选择框

我得到了以下数据库表（尽管数据库中有更多数据，但这还不是全部！）：

在PHP和json_encode（）的帮助下，我正在创建此表的json字符串：

jQuery171024539993586950004_1349776890005([{"0":"0","catid":"0","1":"350","value":"350","2":"350 euro","description":"350 euro"},{"0":"0","catid":"0","1":"500","value":"500","2":"500 euro","description":"500 euro"},{"0":"0","catid":"0","1":"650","value":"650","2":"650 euro","description":"650 euro"},{"0":"1","catid":"1","1":"0","value":"0","2":"No","description":"No"},{"0":"1","catid":"1","1":"1","value":"1","2":"Yes","description":"Yes"}])

现在，我想使用JSON填充选择框，就像在HTML中一样：

<select id="0">
    <option value="350">350 euro</option>
    <option value="500">500 euro</option>
    <option value="650">650 euro</option>
</select>

<select id="1">
    <option value="0">No</option>
    <option value="1">Yes</option>
</select>

350欧元
500欧元
650欧元
不
对

---

有人能帮我吗？我知道如何进行循环来填充表（使用$.getJSON），但我有点受不了这个循环。

通过json解析，您应该必须创建一个解析器，并且通过addcat上的if和else条件，您将能够执行此操作。

此函数将循环通过您发布的对象并填充菜单（给定您发布的源代码）：

var populateSelects=函数（数据）{
var cat0=$（'select#0'），
cat1=$（“选择#1”），
opt=$（''），
newOpt={}，
cat0opts=[]，
cat1opts=[]；
$。每个（数据、功能（i、obj）{
//克隆选项元素，以便不重新创建新元素
newOpt=opt.clone（）；
//obj是数组中的JavaScript对象，所以
//点表示法工作得很好
newOpt.text（对象描述）.val（对象值）；
如果（obj.catid==“0”）{
//推送DOM元素，而不是jQuery对象
cat0opts.push（newOpt[0]）；
}否则如果（obj.catid==“1”）{
cat1opts.push（新选项[0]）；
}
});
//将DOM元素数组添加到它们各自的菜单中，
//清除所有现有菜单项。
cat0.empty（）.append（cat0opts）；
cat1.empty（）.append（cat1opts）；
};

这里有一把小提琴正在演奏：

---

重要的一点是

catid

比较。。。如果解析后的JSON以数字（不是字符串）的形式返回

catid

，那么您需要将比较更改为

if（obj.catid==0）

，通过JSON解析，您应该创建一个解析器，并且通过addcat上的if和else条件，您将能够完成它！非常感谢你花时间写这篇文章。

<select id="0">
    <option value="350">350 euro</option>
    <option value="500">500 euro</option>
    <option value="650">650 euro</option>
</select>

<select id="1">
    <option value="0">No</option>
    <option value="1">Yes</option>
</select>

var populateSelects = function(data) {
    var cat0 = $('select#0'),
        cat1 = $('select#1'),
        opt = $('<option />'),
        newOpt = {},
        cat0opts = [],
        cat1opts = [];
    $.each(data, function(i, obj) {
        //clone the option element so as to not re-create a new one
        newOpt = opt.clone();
        //obj is the JavaScript object in the array, so
        //dot-notation works nicely
        newOpt.text(obj.description).val(obj.value);
        if (obj.catid === "0") {
            //push the DOM element, not the jQuery object
            cat0opts.push(newOpt[0]);
        } else if (obj.catid === "1") {
            cat1opts.push(newOpt[0]);
        }
    });
    //Add the array of DOM elements to their respective menus,
    //clearing out any existing menu items.
    cat0.empty().append(cat0opts);
    cat1.empty().append(cat1opts);
};