javascript - 解释表单附加到 DOM 的对象

Question

我正在编写一个函数来将 json 对象转换为表单，并将其附加到 DOM。

我似乎无法正确理解我的语法； chrome 开发工具在第 15 行给出了“未捕获的语法错误:意外的标识符”错误。

我正在尝试支持表单案例，例如单选、复选框和标准文本或文本框。我不知道如何区分单选按钮和复选框。

这是我到目前为止所拥有的:

jQuery.fn.toForm = function(obj) {

var target = this; 

var form = document.createElement("form");
    form.setAttribute('method', "post");
    form.setAttribute('action', "submit.php");

$.each(obj, function(key, value){

    var inputCheckbox = $("<input type='checkbox' value='"+value+"' />");
    var inputStandard = $("<input type='text' value='"+value+"' />");

    if(typeOf value === 'boolean'){

        inputCheckbox.attr("id", key).attr("name", key).appendTo("form");
        form.append(inputCheckbox);
    }
    else {
        inputStandard.attr("id", key).attr("name", key).appendTo("form");
    }   

    target.append(form); 
});
};

有什么建议吗？

Answer 1

问题似乎出在行上

inputCheckbox.attr("id", key).attr("name", key).appendTo("form");

JQuery 在附加尚未在 dom 中的元素时可能不可靠(我相信这尤其适用于 JQuery 1.9+ - 请参阅 http://bugs.jqueryui.com/ticket/8858 (最后评论)以确认该错误)。

如果你移动

target.append(form); 

在 if 语句上方，您可能会发现这解决了您的问题