您的位置:首页 > Web前端 > JQuery

jquery.form.js修改源码ajax支持json格式参数

2017-04-28 15:05 459 查看

背景

随着RESTFUL格式API的盛行,表单提交jqery的ajax是可以自定义提交的数据格式

但是如果使用jquery.form.js则它默认的格式都是使用的param()方式转成了&的字符串,因此对于严格格式要求application/json的参数则无法支持自定义格式,因此动手修改源码如下;

1.实现param2json方法,默认jquery只有param方法

/**
* 将param对象转为josn格式
* @param a obj对象
* @param traditional  规定是否使用传统的方式浅层进行序列化(参数序列化)。
* @method param2Json
* */
$.param2Json = function(a, traditional) {
var prefix, s = {}, add = function(key, value) {
//如果value是函数,那么调用函数得到返回值作为真正的value值,如果value是null或者undefined
//那么直接value是空字符串,其它情况value不变!
// If value is a function, invoke it and return its value
value = jQuery.isFunction(value) ? value() : (value == null ? ""
: value);
//把key和value值都进行了转码调用encodeURIComponent
s[key] = value;
};
// Set traditional to true for jQuery <= 1.3.2 behavior.
if (traditional === undefined) {
traditional = jQuery.ajaxSettings && jQuery.ajaxSettings.traditional;
}
// If an array was passed in, assume that it is an array of form elements.
if (jQuery.isArray(a) || (a.jquery && !jQuery.isPlainObject(a))) {
// Serialize the form elements  [{name:"avaue"},{age:1}]
jQuery.each(a, function() {
//这里面的each指向前面的数组中的内容,也就是是一个对象!
add(this.name, this.value);
});
} else {
s=a;
}
// Return the resulting serialization
//最后把数组s中的所有的查询字符串通过&链接起来,并且把%20也就是空格用+表示!
return s;
};


为了方便使用,可以把该代码放入common.js中引入页面使用,或者直接放在jquery.form.js源码的倒数第一个}));的上一行作为它的扩展函数使用

2.修改源码

var q;//定义q参数这行开始
//当为json时添加我们自己的转换方式
//when contentType is  application/json  type  the param will be  json string
if (options.contentType&&options.contentType.indexOf('json')>0) {
q = JSON.stringify($.param2Json(a, traditional));
}else{
// change param to a=v&b=v  string :param(d,t) is jquery.js methond
q = $.param(a, traditional);//原有参数转换方式
}
//


3.使用方式

var form = $("form[name=dataForm]");
form.ajaxSubmit({
url:sysMessageTep.basePath,
contentType: "application/json; charset=utf-8", //加上 contentType
dataType: "json",
type:"put",
success:function(res){

}
});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐