javascript - 通过javascript对象循环后动态创建文本框

Question

我有一个 javascript，它通过 ajax 请求向服务器发送一些信息，并接收一些数据作为问题及其 ID 作为 json 数组。

这是我从服务器收到的响应 json 数组的样子:

   [
     {
      "ID":"1",
      "question":"Write a function called addNum. "
        },
     {
      "ID":"3",
      "question":"Write a function called sumDouble "
      }
    ]

这是 JavaScript:

$(document).ready(function(){
    $("form#input_qnumber").submit(function() {

    var questions = $('#questions').attr('value'); // written question
    var quizname = $('#quizname').attr('value');

    if (questions) { // values are not empty
        $.ajax({
            type: "POST",
            url: "https://xxxx",
            contentType: "application/x-www-form-urlencoded; charset=utf-8",
            dataType: "application/json",
            data: 'questions='+questions+'&quizname='+quizname,

            success: function (data) 
            {
                var JSONObject = JSON.parse(data); 

                for (var key in JSONObject) {
                    if (JSONObject.hasOwnProperty(key)) {
                        console.log(JSONObject[key]["ID"] + ", " + JSONObject[key]["question"]);
                    }
                }



            }

        });
    }
    else {
        $('div#createquizresp').text("Enter question ID's separated by a comma to be included in the quiz");
        $('div#createquizresp').addClass("error");
    } // else
    $('div#createquizresp').fadeIn();
    return false;
});
});

如您所见，我可以将响应 json 解析为 JavaScript 对象数组，循环遍历它并将内容转储到控制台中。我想要的是创建 textarea 元素，为其 id 属性提供数组中的“ID”键，并使用数组中相应的问题键对其进行标记。之后我可以将元素附加到我的 html 内的 div 中。但我不太确定如何做到这一点，或者是否可能。请停下来。

Answer 1

如果您还想要一个标签元素；

for (var key in JSONObject) {
    if (JSONObject.hasOwnProperty(key)) {
        $('<label>')
            .attr('for', JSONObject[key]["ID"])
            .html(JSONObject[key]["question"])
            .appendTo('wherever_you_want');
        $('<textarea>')
            .attr('id', JSONObject[key]["ID"])
            .appendTo('wherever_you_want');
    }
}