用json填充下拉列表

Question

我有包含列 id 和名称的 SQLite 表。我从 autocomplete.php 页面返回这些行的数组，如 json。如何使用 jquery 和 JavaScript 使用此 json 填充选项（下拉列表）？我是 JavaScript 和 JQuery 的新手，我用谷歌搜索但没有找到方法。在 ASP.NET 中这很容易，但在这里我不知道。有人会帮忙吗？

这是我的 JSON 示例，可以更长。

 [
    {
        "id": "1",
        "name": "test"
    },
    {
        "id": "1",
        "name": "test"
    }
]

原文由 Tara 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

HTML:

 <select id="sel">

</select>

脚本：

 $(function() {
    var data = [
        {
        "id": "1",
        "name": "test1"},
    {
        "id": "2",
        "name": "test2"}
    ];
    $.each(data, function(i, option) {
        $('#sel').append($('<option/>').attr("value", option.id).text(option.name));
    });
})

这是一个工作示例。 http://jsfiddle.net/ms2Ma/

原文由 Ashish 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

试试这个，这将为您提供一个选项，让您可以使用任意数量的下拉框和 JSON 节点来配置下拉框。

您需要执行以下几个步骤：

• 创建一个下拉框数组。（例如，如果你必须配置手机，那么你应该使用颜色、内存等的下拉列表）
• 按照在代码中创建的方式创建 JSON 对象。不要更改以“level1”开头并以任意数量的节点结尾的可配置项名称，因为它首先必须与您正在创建的数组项的索引同步。

这是数据：

 var Dropdowns = ["Model", "Color", "Memory","design","covers","music"];
var Data ={"phones":[
  {
     "oid":":000000F0:00000458:",
     "level1":"3G",
     "level2":"white",
     "level3":"16GB",
     "level4":"slim",
     "level5":"Back cover",
     "level6":"headphone",
     "price":"£568.63",
     "addToCart":"#Cart1"
  },
  {
     "oid":":000000F0:000003DA:",
     "level1":"3G",
     "level2":"black",
     "level3":"16GB",
     "level4":"slim",
     "level5":"Flip cover",
     "level6":"headphone",
     "price":"£615.79",
     "addToCart":"#Cart7"
  }]};

在此处查看完整的工作代码： https ://jsfiddle.net/raju_sumit/681ppgq0/5/

原文由 Sumit Raju 发布，翻译遵循 CC BY-SA 3.0 许可协议