Question

我希望能够从我的html表单创建一个javascript对象，并且想知道是否有一种使用jquery执行此操作的好方法。我想我正在寻找的是与$.serialize类似的东西，但这会导致地图而不是字符串。

<form>
  <input type="text" name="foo1" value="bar1" />
  <input type="text" name="foo2" value="bar2" />
</form>

期望的结果：

{ foo1:"bar1", foo2:"bar2" }

Answer 1

var oElements = {};
$('form [name]').each(function(){
    oElements[this.name] = this.value;
});

Answer 2

这是对使用jQuery的主题更加强大的看法。 extractObjectFromForm采用包含元素和任意对象实例的字段的选择器。这适用于已知和未知（咧嘴）输入类型。它还可以创建包含嵌套元素的复杂对象结果。

/**
 * Extracts form elements and maps to passed in object
 */
function    extractObjectFromForm($fieldContainer,objectType) {
    var innerArray=[];
    var obj = $.map($fieldContainer.find(":input"), function(n, i)
    {
        var o = {};
        if($(n).is("input:text") 
                || $(n).is("textarea") 
                || $(n).is("input:hidden") 
                || $(n).is("input:password"))
            o[n.name] = $(n).val();
        else if($(n).is("input:checkbox"))
            o[n.name] = ($(n).is(":checked") ? true:false);
        else if(n.type == 'radio') {
            if(innerArray.indexOf(n.name)==-1) {
                innerArray.push(n.name);
            }
        }
        else
            o[n.name] = $(n).val();
        return o;
    });
    $.each(innerArray,function(index,item){
        var iobj={};
        iobj[item]=$("input[name='"+item+"']:checked").val();
        obj.push(iobj);
    });
    return getObjectFromObject(obj,objectType);
}

/**
 * Takes a object created from a form scour and
 * converts it to an Object type
 */
function    getObjectFromObject(formObject,outputObject) {
    $.each(formObject,function(index,item){
        $.each(item,function(key,value){
            if(key.indexOf(".") == -1)
                outputObject[key] = value;
            else {
                var mainkey = key.substr(0,key.indexOf("."));
                var subkey = key.substr(key.indexOf(".")+1);
                outputObject[mainkey][subkey]=value;
            }
        });
    });
    return outputObject;
}

Answer 3

serializeArray（）怎么样 http://api.jquery.com/serializeArray/

更新：还找到了这个插件，它与其他海报的答案基本相同，但看起来它可以处理嵌套数组。 http://github.com/cowboy/jquery-misc/blob/master/jquery.ba-serializeobject.js

如何使用jQuery从表单元素创建javascript对象

3 个答案: