jquery之获取form表单数据的两种方式,提交方式为post

form表单提交获取键值对对象的两种方式

html

    




js

$(document).ready(function() {
			$('#serialize').on('click', function() {
				// 方法一 serialize
				var str = $('form').serialize();
				getObj(str);
				// 得到序列化字符串
				// name=freely&age=20&city=beijing&job=fe
				// 方法二 serializeArray
				var arr = $('form').serializeArray();
				// 得到数组对象
				/*
					0: {name: "name", value: "freely"}
					1: {name: "age", value: "20"}
					2: {name: "city", value: "beijing"}
					3: {name: "job", value: "fe"}
				*/
				// 遍历数组得到 {name: 'freely', age: 20}数据格式
				// 使用jquery方法 $.each方法
				var tempObj = {};
				$.each(arr, function(i, obj) {
					tempObj[obj.name] = obj.value;
				});
				console.log(tempObj); // {name: "freely", age: "20", city: "beijing", job: "fe"}
			});
		});

		function getObj(str) {
			let arr = str.split('&');
			let obj = {};
			arr.map(function(item) {
				let tempArr = item.split('=');
				obj[tempArr[0]] = tempArr[1];
			});
			console.log(obj); // {name: "freely", age: "20", city: "beijing", job: "fe"}
		}

 

你可能感兴趣的:(jquery)