用js將表單資料封裝成json字串
阿新 • • 發佈:2018-12-12
用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>