溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要講解了“Ajax表單插件jqueryform的使用”，文中的講解內容簡單清晰，易于學習與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學習“Ajax表單插件jqueryform的使用”吧！
首先我們載入jquery庫和jquery.form.js插件。jquery.form.js插件的官網地址：http://www.malsup.com/jquery/form/
$(function(){
var options = {
beforeSubmit: showRequest, //提交前處理
success: showResponse, //處理完成
resetForm: true,
dataType: 'json'
};
$('#my_form').submit(function() {
$(this).ajaxSubmit(options);
});
});
function showRequest(formData, jqForm, options) {
var uname = $("#uname").val();
if(uname==""){
$("#msg").html("姓名不能為空！");
return false;
}
var age = $("#age").val();
if(age==""){
$("#msg").html("年齡不能為空！");
return false;
}
$("#msg").html("正在提交...");
return true;
}
function showResponse(responseText, statusText) {
$("#msg").html('提交成功');
var sex = responseText.sex==1?"男":"女";
$("#output").html("姓名："+responseText.uname+" 性別："+sex+" 年齡："+responseText.age);
}
以上代碼完成了表單提交前的驗證以及提交后的處理。表單數據提交到submit.php后，我們可以根據實際情況通過submit.php檢測數據、將數據寫入數據庫，返回操作結果等等操作，本文不再列出代碼。
ajaxSubmit()提供了豐富的選項設置，我們根據使用的可能性大小進行列表，以供參考。
屬性 描述 url Ajax請求將要提交到該url，默認是表單的action屬性值 type 指定提交表單數據的方法（method）：“GET”或“POST”。默認值：表單的method屬性值（如果沒有找到默認為“GET”）。 dataType 期望返回的數據類型。null、“xml”、“script”或者“json”其中之一。dataType提供一種方法，它規定了怎樣處理服務器的響應。這個被直接地反映到jQuery.httpData方法中去。下面的值被支持： 'xml'：如果dataType == 'xml'，將把服務器響應作為XML來對待。同時，如果“success”回調方法被指定， 將傳回responseXML值。 'json'：如果dataType == 'json'， 服務器響應將被求值，并傳遞到“success”回調方法，如果它被指定的話。。 'script'：如果dataType == 'script'， 服務器響應將求值成純文本。。 默認值：null（服務器返回responseText值） target 指明頁面中由服務器響應進行更新的元素。元素的值可能被指定為一個jQuery選擇器字符串，一個jQuery對象，或者一個DOM元素。 默認值：null。 beforeSubmit 表單提交前被調用的回調函數。“beforeSubmit”回調函數作為一個鉤子（hook），被提供來運行預提交邏輯或者校驗表單數據。如果“beforeSubmit”回調函數返回false，那么表單將不被提交。“beforeSubmit”回調函數帶三個調用參數：數組形式的表單數據，jQuery表單對象，以及傳入ajaxForm/ajaxSubmit中的Options對象。 默認值：null success 表單成功提交后調用的回調函數。如果提供“success”回調函數，當從服務器返回響應后它被調用。然后由dataType選項值決定傳回responseText還是responseXML的值。 默認值：null clearForm 表示如果表單提交成功是否清除表單數據。默認值：null resetForm 表示如果表單提交成功是否進行重置。默認值: null
jquery.form插件還提供了formToArray()、formSerialize()、fieldSerialize()、fieldValue()、clearForm()、clearFields() 和 resetForm()等方法。通常我們可以使用表單驗證插件和jquery.form插件一起使用，效果更好。
感謝各位的閱讀，以上就是“Ajax表單插件jqueryform的使用”的內容了，經過本文的學習后，相信大家對Ajax表單插件jqueryform的使用這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是億速云，小編將為大家推送更多相關知識點的文章，歡迎關注！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
