serializeObject——序列化Form表单到一个对象

HTML代码:

<div id="test">
    <input name="text1" value="txt-one" />
    <input type="checkbox" name="top[child][]" value="1" checked="checked" />
    <input type="checkbox" name="top[child][]" value="2" checked="checked" />
    <input type="checkbox" name="top[child][]" value="3" checked="checked" />
    
    <select name="another[select]">
        <option value="opt"></option>
    </select>
</div>

$( '#test' ).serializeObject();

Returns

{ text1: "txt-one",
  top: {
    child: [ "1", "2", "3" ]
  },
  another: {
    select: "opt"
  }
}


js脚本:

/* 
* .serializeObject (c) Dan Heberden
* danheberden.com
* 
* Gives you a pretty object for your form elements
*/
(function($){
  $.fn.serializeObject = function() {
    if ( !this.length ) { return false; }

    var $el = this,
      data = {},
      lookup = data; //current reference of data

      $el.find(':input[type!="checkbox"][type!="radio"], input:checked').each(function() {
        // data[a][b] becomes [ data, a, b ]
        var named = this.name.replace(/\[([^\]]+)?\]/g, ',$1').split(','),
            cap = named.length - 1,
            i = 0;

        for ( ; i < cap; i++ ) {
            // move down the tree - create objects or array if necessary
            lookup = lookup[ named[i] ] = lookup[ named[i] ] ||
                ( named[i+1] == "" ? [] : {} );
        }

        // at the end, psuh or assign the value
        if ( lookup.length != undefined ) {
             lookup.push( $(this).val() );
        }else {
              lookup[ named[ cap ] ]  = $(this).val();
        }

        // assign the reference back to root
        lookup = data;
      });

    return data;
  };
})(jQuery);


 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值