1. 程式人生 > >用js將表單資料封裝成json字串

用js將表單資料封裝成json字串

用js將表單資料封裝成json字串

1.js中封裝程式碼:

 $.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;
		};

2.js呼叫方法:

//.loginForm換成你自己的選擇器
jsonObj = $(".loginForm").serializeObject(); // json物件
var username = jsonObj.username;
	...

3.html程式碼示例為(每個欄位必須有name):

<form method="post" class="loginForm">
			<div class="form-group">
				<div class="input-group">
					<div class="input-group-addon">
						<i class="fa fa-user fa-fw"></i>
					</div>
					<input class="form-control" type="text" placeholder="使用者名稱"
						id="username" name="username" minlength="2" autocomplete="off">
				</div>
			</div>
			<div class="form-group">
				<div class="input-group">
					<div class="input-group-addon">
						<i class="fa fa-desktop fa-fw"></i>
					</div>
					<input class="form-control" type="password" placeholder="密碼"
						minlength="5" id="password" name="password">
				</div>
			</div>
			<button type="submit" class="btn btn-primary">登入系統</button>
		</form>