javascript - 嵌套的 jQuery 每个语句在第一个语句完成后运行

Question

我想通过读取 JSON 变量动态创建组合框。

问题是第一个$.each()语句总是在第二个 $.each() 之前完成陈述。

这使得两个选项落在 <select> 之外元素。

我做错了什么？

var oFields = {
    "fields": [
        {"name": "idtipopratica", "label": "ID Tipo Prat.", "type": "hidden", "visible": "true", "disabled": "false"},
        {"name": "tipologia", "label": "Tipologia", "type": "select", "selectParams": {
            "source": "list",
            "values": {"CC":"Conto Corrente","FI":"Conto Finanziario"}
        },"visible": "true", "disabled": "false"}
    ]
};
var html = '<form id="editForm" method="post" class="form-horizontal">';
$.each(oFields.fields, function (i, object) {
    switch(object.type) {
        case "select":
            html += '<select id="' + object.name + '" name="' + object.name + '"/>';
            var selectParams = object.selectParams;
            console.log(selectParams);
            if (selectParams.source === "table") {
                //console.log(selectParams.keycolumn);
            } else {
                $.each(selectParams.values, function(k,v){
                    html += '<option value="' + k + '">' + v + '</option>';
                    console.log(k+"|"+v);
                });
            }
            break;
        default:
            html += '<input type="' + object.type + '" id="' + object.name + '" name="' + object.name + '"/>';
    }
    html += '</select>';
});
html += '</form>';
$("body").html(html);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 1

您在 select 元素的开始标记中包含了一个自关闭标志 (/>)

html += '<select id="' + object.name + '" name="' + object.name + '"/>';

应该是

html += '<select id="' + object.name + '" name="' + object.name + '">';

( Demo )