js 序列化表单form为对象

2019独角兽企业重金招聘Python工程师标准>>>

form 表单：
 

<form id="param_form">
    <input type="hidden" name="search_key" value="{{ cd.search_key }}">
    <input type="hidden" name="search_price_gte" id="money_start" value="{{ cd.search_price_gte|default_if_none:'' }}">
    <input type="hidden" name="search_price_lte" id="money_end" value="{{ cd.search_price_lte|default_if_none:'' }}">
    <input type="hidden" id="rarity_id" name="search_rarity_id" value="{{ cd.search_rarity_id|default_if_none:'' }}"/>
    <input type="hidden" id="exterior_id" name="search_exterior_id" value="{{ cd.search_exterior_id|default_if_none:'' }}"/>
    <input type="hidden" id="sort_key" name="search_sort_key" value="{{ cd.search_sort_key|default_if_none:1 }}"/>
    <input type="hidden" id="sort_rule" name="search_sort_rule" value="{{ cd.search_sort_rule|default_if_none:1 }}"/>
    <input type="hidden" id="is_stattrak" name="search_is_stattrak" value="{{ cd.search_is_stattrak|default_if_none:'' }}">
    <input type="hidden" id="is_sticker" name="search_is_sticker" value="{{ cd.search_is_sticker|default_if_none:'' }}">
    <input type="hidden" id="search_product_id" name="search_product_id" value="{{ cd.search_product_id|default_if_none:'' }}">
    <input type="hidden" id="page_no" name="search_page_no" value="{{ cd.search_page_no }}"/>
</form>

serializeObject()方法封装：

$.fn.serializeObject = function () {
        var o = {};
        var a = this.serializeArray();
        $.each(a,
                function () {
                    if (o[this.name] !== undefined) {
                        if (!o[this.name].push) {
                            o[this.name] = [o[this.name]];
                        }
                        o[this.name].push(this.value || '');
                    } else {
                        o[this.name] = this.value || '';
                    }
                });
        return o;
    };

使用 并实现跳转：

var url_param = $('#param_form').serializeObject();
function genUrl(url, params) {
        var new_params = {}
        for (var key in params) {
            if (params[key]) {
                new_params[key] = params[key]
            }
        }
        return url + '?' + $.param(new_params)
    }
window.location = genUrl(window.location.href.split('?')[0], url_param);

总结： 以后遇到多条件查询问题 可以将参数封装在一个隐藏的表单中 最后提交

转载于:https://my.oschina.net/jamescasta/blog/994709