jQuery反序列化表单

Question

我正在使用jQuery Serialize来序列化我的表单元素,并希望将它们反序列化.不幸的是找不到任何有效的jQuery反序列化器,有什么建议吗？

Answer 1

我编写了一个jQuery.deserialize版本,它支持从serialize,serializeArray和serializeObject函数生成的序列化数据.它还支持所有表单元素类型,包括复选框和单选按钮.

Answer 2

试试这个:

function deparam(query) {
    var pairs, i, keyValuePair, key, value, map = {};
    // remove leading question mark if its there
    if (query.slice(0, 1) === '?') {
        query = query.slice(1);
    }
    if (query !== '') {
        pairs = query.split('&');
        for (i = 0; i < pairs.length; i += 1) {
            keyValuePair = pairs[i].split('=');
            key = decodeURIComponent(keyValuePair[0]);
            value = (keyValuePair.length > 1) ? decodeURIComponent(keyValuePair[1]) : undefined;
            map[key] = value;
        }
    }
    return map;
}

Answer 3

我对尝试JQuery.deserialize非常感兴趣,但它似乎根本没有处理复选框,所以它不能满足我的目的.所以我写了自己的.事实证明它比我想象的要容易,因为jQuery val()函数完成了大部分工作:

jQuery.fn.deserialize = function (data) {
    var f = this,
        map = {},
        find = function (selector) { return f.is("form") ? f.find(selector) : f.filter(selector); };
    //Get map of values
    jQuery.each(data.split("&"), function () {
        var nv = this.split("="),
            n = decodeURIComponent(nv[0]),
            v = nv.length > 1 ? decodeURIComponent(nv[1]) : null;
        if (!(n in map)) {
            map[n] = [];
        }
        map[n].push(v);
    })
    //Set values for all form elements in the data
    jQuery.each(map, function (n, v) {
        find("[name='" + n + "']").val(v);
    })
    //Clear all form elements not in form data
    find("input:text,select,textarea").each(function () {
        if (!(jQuery(this).attr("name") in map)) {
            jQuery(this).val("");
        }
    })
    find("input:checkbox:checked,input:radio:checked").each(function () {
        if (!(jQuery(this).attr("name") in map)) {
            this.checked = false;
        }
    })
    return this;
};

你应该能够像这样使用它:

$("#myform").deserialize(data);

数据是一个参数列表,例如$("#myform").serialize()会产生什么.

它会影响表单中的所有字段,并清除数据中未包含的字段的值.但您也可以传递任何选择器以仅影响特定字段,就像使用序列化函数一样.例如:

$("select").deserialize(data);

Answer 4

jQuery Serialize的一半是param(),因此反序列化查询字符串的一半将成为一个deparam.不幸的是,我找不到一个好的独立deparam.现在我建议使用jQuery BBQ库并使用它.如果你不需要其他东西,你可以删除它们.我在某地读过Ben Alman(牛仔)计划将deparam提取到自己的模块中.

对于反序列化的其余部分,您只需要遍历deparam返回的对象以及对象中的每个键和值对,根据键选择表单元素,并将表单元素值设置为值.

Answer 5

在这一点上迟到了,但有人可能会觉得这很有用.

function fetchInput(identifier) {
    var form_data = identifier.serialize().split('&');
    var input     = {};

    $.each(form_data, function(key, value) {
        var data = value.split('=');
        input[data[0]] = decodeURIComponent(data[1]);
    });

    return input;
}