jQuery之ajax学习笔记一

$.param():

        console.log($.param({'aaa':'1','bbb':'2'}));//aaa=1&bbb=2
	console.log($.param({'aaa':'[','bbb':'2'}));//aaa=%5B&bbb=2
	console.log($.param({'aaa':[1,3],'bbb':'2'}));//aaa%5B%5D=1&aaa%5B%5D=3&bbb=2
	console.log(decodeURIComponent($.param({'aaa':[1,3],'bbb':'2'})));//aaa[]=1&aaa[]=3&bbb=2
	console.log(decodeURIComponent($.param({'aaa':[1,3],'bbb':'2'},true)));//aaa=1&aaa=3&bbb=2
	
	console.log($.param({'name':'1','value':'2'}));//name=1&value=2
	console.log($.param([{'name':'1','value':'2'}]));//1=2。数组形式只是针对name和value,即表单的形式。
	console.log($.param([{'name':'1','value':'2'},{'name':'3','value':'4'}]));//1=2&3=4
	console.log($.param([{'aaa':'1','bbb':'2'}]));//undefined=
提交表单前后网址的变化:
        点击按钮前的网址:http://127.0.0.1:8020/jQuery/1.html?
点击按钮后的网址:http://127.0.0.1:8020/jQuery/1.html?1=2&3=4

        


源码分析:

jQuery.param = function( a, traditional ) {
	var prefix,
		s = [],
		add = function( key, value ) {
			// If value is a function, invoke it and return its value
			//如果value是一个函数,使用此函数的返回值重新赋值给value
			value = jQuery.isFunction( value ) ? value() : ( value == null ? "" : value );
			//键值对编码后,放入数组s中
			s[ s.length ] = encodeURIComponent( key ) + "=" + encodeURIComponent( value );
		};

	// Set traditional to true for jQuery <= 1.3.2 behavior.
	if ( traditional === undefined ) {
		//ajax中也可以操作traditional
		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
		//each函数的第二个参数是一个函数,该函数中的this是指a,因为each函数中用了call和apply
		jQuery.each( a, function() {
			add( this.name, this.value );
		});

	} else {
		// If traditional, encode the "old" way (the way 1.3.2 or older
		// did it), otherwise encode params recursively.
		for ( prefix in a ) {
			buildParams( prefix, a[ prefix ], traditional, add );
		}
	}

	// Return the resulting serialization
	//join()函数的返回值是一个字符串,通过把array的每个元素转换成字符串,然后把这些字符串连接起来,在两个元素之间插入&而生成。
	//再将空格转化为+
	//replace将空格转化成+
	return s.join( "&" ).replace( r20, "+" );
};


function buildParams( prefix, obj, traditional, add ) {
	var name;

	if ( jQuery.isArray( obj ) ) {//判断value值是不是数组,如{'aaa':[1,3],'bbb':'2'}中的[1,3]
		// Serialize array item.
		jQuery.each( obj, function( i, v ) {//i就是[1,3]中的下标,v就是下标对应的值
			if ( traditional || rbracket.test( prefix ) ) {
				// Treat each array item as a scalar.
				//如果是传统的,就直接调用add,结果为aaa=1&aaa=3&bbb=2
				add( prefix, v );

			} else {
				// Item is non-scalar (array or object), encode its numeric index.
				buildParams( prefix + "[" + ( typeof v === "object" ? i : "" ) + "]", v, traditional, add );
			}
		});

	} else if ( !traditional && jQuery.type( obj ) === "object" ) {//{'aaa':{a1:111},'bbb':'2'}
      // console.log(decodeURIComponent($.param({'aaa':{'a1':'111'},'bbb':'2'})));//aaa[a1]=111&bbb=2
		// Serialize object item.
		for ( name in obj ) {
			buildParams( prefix + "[" + name + "]", obj[ name ], traditional, add );
		}

	} else {
		// Serialize scalar item.
		add( prefix, obj );
	}
}
serialize()和serializeArray()针对表单的两个函数:

	



你可能感兴趣的:(jQuery)