jQuery異步總結
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
開發工具與關鍵技術：Adobe Dreamweaver JavaScript
作者：黃富滔
撰寫時間：2020年5月03日
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
1語法：
jQuery.ajax([setting])方法
setting代表的是可選的值，用于配置Ajax請求的鍵值對集合
2、Ajax的一些引數（鍵與值）
①type：代表提交的型別。在使用時通過什么方式提交可以通過type的屬性值GET或POST提交，默認情況下為GET提交。 例如： type: "get"
②url：發送請求的地址。當資料請求完畢之后需要提交資料控制器，通過該屬性可以設定提交的地址
例如：url: "/jQueryAjax/getPersonInfor" 【第一個為控制器名稱，第二個為控制器中方法名稱】
③async:是否設定為異步。默認值為true（異步），當使用異步的時候，此句代碼可以省略不寫。當使用同步的時候，便設定為false，同步必須要等到其它請求完成才可以執行操作。例如：async:true,
④ dataType:預期服務器回傳的資料型別,如果不指定，jQuery將自動根據http包MIME資訊來智能判斷,
一般我們采用json格式，可以設定為"json" 例如：dataType: "json",
⑤ success:是一個方法，請求成功后的回呼函式，傳入回傳后的資料，以及包含成功代碼的字串
⑥ error:是一個方法，請求失敗是呼叫此函式，傳入XMLHttpRequest物件
serialize() 通過該方法可以序列化表單內容為字串
serializeArray() 序列化表單元素 (類似 '.serialize()' 方法) 回傳 JSON 資料結構資料。
注意：此方法回傳的是JSON物件而非JSON字串。需要使用插件或者第三方庫進行字串化操作
回傳的JSON物件是由一個物件陣列組成的，其中每個物件包含一個或兩個名值對——name引數和value引數
2、表單中常用到的代碼塊
①自定義變數獲取表單內容
var name = $("#txtName").val();
var sex = $("#cboSex").val();
var address = $("#txtAddress").val();
②判斷資料是否完整
if (name == "" || sex == 0 || address == "") {
alert("請檢查資料是否完成");
return false;
}
③拼接字符，并通過序列化方法序列化表單
var frmdata = "name=" + name + "&sex=" + sex + "&address=" + address;
var serData = $("#myform").serialize();
var arrData = $("#myform").serializeArray();
④通過ajax方法從服務器上獲取資料
$.ajax({
type: "get",
url: "/jQueryAjax/getPersonInfor",
async:true,
dataType: "json",
success: function (data) {
console.log(data);
$("#txtName").val(data.name);
$("#cboSex").val(data.sex);
$("#txtAddress").val(data.address);
}
})
⑤通過Ajax方式把資料提交給控制器，并且回傳提示
$.ajax({
type: "post",
url: "/jQueryAjax/getDataByFormCollection",
data: arrData,
//dataType:'json'
success: function (msg) {
alert(msg);
},
error: function (xmlhttp) {
console.log(xmlhttp);
}
})
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/54530.html
標籤：JavaScript
上一篇：jQuery異步ajx對總結
下一篇：angular框架運行時出錯