Jquery取form表單中的所有引數
阿新 • • 發佈:2019-02-07
表單:
<form class="" id="handle-form">
<input type="text" name="id" id="id" value="">
<input type="text" id="operator" name="operator" >
</form>
第一種獲取form中資料的方法:
new FormData($('#uploadForm')[0])用法與$("#handle-form").serialize()差不多,就是 可以上傳檔案但是對於jquery的要求是, 版本1.8及其以上方可支援;
注意:按鈕type非submit,而是buttern,Action 為空或無;
var handle-form = $("#handle-form").serialize();
$.ajax({
url: "",
type: "post",
contentType: "application/json; charset=utf-8",
data: $("#handle-form").serialize();,
dataType: "json",
success: function (data) {
}
第二種獲取form中資料的方法:
注意:按鈕type非submit,而是buttern,Action 為空或無;
var formSerial = {};
$($("#handle-form").serializeArray()).each(function(){
formSerial[this.name] = this.value;
});
var fromValue = JSON.stringify(formSerial)
$.ajax({ url: "", type: "post", contentType: "application/json; charset=utf-8", data: JSON.stringify(formSerial), dataType: "json", success: function (data) { }
form表單提交的幾種方法:
一.表單提交
<form action=’/login’ method=’post’ id = "loginForm">
<input type=’text’ name=’username’ />
<input type=’password’ name=’password’/>
<input type=’submit’ value=’登陸'/>
</form>
二.Ajax提交form表單
$('#loginForm').submitForm({
url: "/login",
dataType: "text",
callback: function (data) {
}
},
before: function () {
}
}).submit();
三.form表單提交附件
需要設定form的enctype="multipart/form-data"並且新增<input type=’file’>
//jQuery提交
$("#jqueryBtn").click(function(){
$("#loginForm").submit();
})
//js提交
$("#jsBtn").click(function(){
document.loginForm.action="RegisterAction.action";
document.loginForm.submit();
})
//js提交
$("#jsBtn").click(function(){
document.getElementById('').submit();
})
//ajax提交
$("#ajaxBtn").click(function() {
var params = $("#loginForm").serialize();
$.ajax( {
type : "POST",
url : "RegisterAction.action",
data : params,
success : function(msg) {
alert("success: " + msg);
}
});
})