Form表单获取数据处理

提交表单填写的数据

var formData = $('form[id="calculateShipCostForm"]').serialize();
var formDataArr = $('form[id="calculateShipCostForm"]').serializeArray();

console.dir(formData);      //通过$("#form").serialize()可以获取到序列化的表单值字符串。
console.dir(formDataArr);       //通过$("#form").serializeArray()输出以数组形式序列化表单值

Form表单获取数据处理_第1张图片

将数组序列化转为对象

//添加扩展函数
$.fn.serializeObject = function()
        {
           var o = {};
           var a = this.serializeArray();
           $.each(a, function() {
               if (o[this.name]) {
                   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 formDataObj = $('form[id="calculateShipCostForm"]').serializeObject();

得到:
Form表单获取数据处理_第2张图片

var formDataJson = JSON.stringify(formDataObj);    //将对象转化为json字符串
formDataJson = JSON.parse(formDataJson);           //将json字符串转化为对象

data = $.extend({},formDataObj,data);              //json对象合并

Form表单获取数据处理_第3张图片

总结:

注意js中post提交的为json对象。

//获取数据
var formData = $('form[id="calculateShipCostForm"]').serialize();
var formDataArr = $('form[id="calculateShipCostForm"]').serializeArray();
var formDataObj = $('form[id="calculateShipCostForm"]').serializeObject();
var formDataJson = JSON.stringify(formDataObj);

console.dir(formData);
console.dir(formDataArr);
console.dir(formDataObj);
console.dir(formDataJson);

你可能感兴趣的:(jQuery,javascript)