Question

我需要动态填充这种类型的下拉列表。

默认情况下首先显示，并且在选择特定选项时，相应的第二个下拉列表将显示其相关选项并隐藏其他选项。

然后在选择其选项时，应使用相应的选项打开第三级下拉列表。

用XML或JSON处理这些数据会更好吗？我在使用jQuery和AJAX解析这些数据时遇到了困难。有人可以帮助我以动态的方式解决这个问题。我的HTML没有任何标签。它应该全部动态填充。

感谢。

以下是HTML的呈现方式。默认情况下，只有第一个下拉列表在选择其选项时可见，第二个下拉列表应填充其相关选项，依此类推......

http://jsfiddle.net/wNjLm/1/

Answer 1

我肯定会使用JSON。这是一个小例子：

var data = [
    {
        name: "English Languages",
        values: ["English 1", "English 2", "English 3", "English 4"]
    },
    {
        name: "French Languages",
        values: ["French 1", "French 2", "French 3", "French 4"]
    },
    {
        name: "Spanish Languages",
        values: ["Spanish 1", "Spanish 2", "Spanish 3", "Spanish 4"]
    }
];

for(var i = 0; i < data.length; i++) {
    var category = data[i];
    var optgroup = $("<optgroup>").prop("label", category.name);
    for(var j = 0; j < category.values.length; j++)
        optgroup.append($("<option>").text(category.values[i]));

    $("#lang").append(optgroup);
}

http://jsfiddle.net/wNjLm/2/

这将使用JSON数据填充选择（在这种情况下已经加载）。

在json或xml中填充动态选择下拉列表（AND HOW）

1 个答案: