表单序列化 不根据name value 根据自定义key value完成

本文介绍了一种改进的jQuery序列化方法,该方法通过扩展jQuery的功能,为表单元素提供更灵活的数据收集方式,特别关注了如何处理复选框、单选按钮等元素的状态,并确保提交的数据格式统一。
var rsubmitterTypes = /^(?:submit|button|image|reset|file)$/i; 
var rsubmittable = /^(?:input|select|textarea|keygen)/i;  
var rcheckableType = (/^(?:checkbox|radio)$/i);  
var rCRLF = /\r?\n/g;  
// jQuery.fn.extend({  
//     serialize: function() {  
//         return jQuery.param( this.serializeArray() );  
//     },  
//     serializeArray(): function() {  
//         return this.map(function() {  
//             // Can add propHook for "elements" to filter or add form elements  
//             var elements = jQuery.prop( this, "elements" );  
//             return elements ? jQuery.makeArray( elements ) : this;  
//         })  
//         .filter(function() {  
//             var type = this.type;  
//             return this.name && !jQuery( this ).is( ":disabled" ) &&  
//                 rsubmittable.test( this.nodeName ) && !rsubmitterTypes.test( type ) &&  
//                 ( this.checked || !rcheckableType.test( type ) );  
//         })  
//         .map(function( i, elem ) {  
//             var val = jQuery( this ).val();  
//             return val == null ?  
//                 null :  
//                 jQuery.isArray( val ) ?  
//                     jQuery.map( val, function( val ) {  
//                         return { name: elem.name, value: val.replace( rCRLF, "\r\n" ) };  
//                     }) :  
//                     { name: elem.name, value: val.replace( rCRLF, "\r\n" ) };  
//         }).get();  
//     }  
// });  
jQuery.fn.extend({  
    serArray: function() {  
        return this.map(function() {  
            var elements = jQuery.prop( this, "elements" );  
            return elements ? jQuery.makeArray( elements ) : this;  
        })  
        .filter(function() {  
            var type = this.type;  
            return jQuery( this ).attr("key") && !jQuery( this ).is( ":disabled" ) &&  
                rsubmittable.test( this.nodeName ) && !rsubmitterTypes.test( type ) &&  
                ( this.checked || !rcheckableType.test( type ) );  
        })  
        .map(function( i, elem ) {    
            var val = jQuery( this ).val(); 
            var key = jQuery( this ).attr("key"); 
            return val == null ?  
                null :  
                jQuery.isArray( val ) ?  
                    jQuery.map( val, function( val ) {  
                        return { key: key, value: val.replace( rCRLF, "\r\n" ) };  
                    }) :  
                    { key: key, value: val.replace( rCRLF, "\r\n" ) };  
        }).get();  
    }  
}); 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值