javascript - 从数据库调用动态填充选择标签选项

Question

我正在尝试通过数据库调用在我的网络应用程序上填充静态内容，该数据库调用返回一个 JSON 元素列表，然后我想让选项 1 填充该列表。

JSON returned:
{id: 0, categoryName: "General Discussion"},
.
.
.
{id: 7, categoryName: "Cleaning and Repairs"}

我的电话:

        $.get("http://localhost:8080/cc/sc/cat").done(function(categories) {
            var catList = document.getElementById("categories");
            var option = document.createElement("option");
            for (category in categories){
                console.log("value: " + categories[category].categoryName);
                option.text = categories[category].categoryName;
                catList.add(categories[category].categoryName);
            }
        });

HTML 内容

<select id="categories" class="form-control"></select>

错误:

(index):116 Uncaught TypeError: Failed to execute 'add' on 'HTMLSelectElement': The provided value is not of type '(HTMLOptionElement or HTMLOptGroupElement)'
at Object.<anonymous> ((index):116)
at i (jquery.min.js:2)
at Object.fireWith [as resolveWith] (jquery.min.js:2)
at y (jquery.min.js:4)
at XMLHttpRequest.c (jquery.min.js:4)

感谢任何帮助。

Answer 1

试试这个

$.get("http://localhost:8080/cc/sc/cat").done(function(categories) {
            for (category in categories){
              $('#categories').append('<option>'+categories[category].categoryName+'</option>')
            }
        });