Ajax<二>
阿新 • • 發佈:2018-10-31
1.同步和非同步
==>同步/非同步概念
同步:==順序完成== 第一步--->第二部-->第三部....
非同步:在完成自己工作時,分擔給另一個人完成部分,事件同時進行
2.timeout和ontimeout
timeout:請求超時設定.屬性,用來設定等待響應時長,如果超過指定時長,則會結束本次請求,並觸發ontimeout事件
xhr.timeout = 3000; // 設定等待時長為3秒
ontimeout:事件,用來設定超過等待時間後的動作
xhr.ontimeout = function () { alert('請求超時') }
在建立xhr事件之後,來設定timeout屬性;如果設定了timeout屬性,那麼就建議設定ontimeout事件.
3.FormDate表單物件
FormDate物件優勢就是能顧一次性將表單中的所有資料全部取出,包括檔案域的檔案物件.
1)建立表單
①必須有form標籤,methord和action不重要
②每個表單域需要設定name值
2)傳送Ajax請求
①將表單資料取出 --- FormDate i. 獲取form表單物件 var fm = document.getElementById('form'); //dom物件 ii. 例項化FormDate物件; var fd -= new FormDate(fm); ② 傳送Ajax請求
3)在php頁面中,使用$_POST接受資料,檔案資料要用$_FILSE
注意點
①form標籤要給id值,方便獲取form標籤的DOM物件 ②每個域都要給name值 ③提交按鈕必須用button值,submit會跳轉 ④使用formdate物件時,先獲取form的DOM值,再例項化FormDate,並將form的DOM作為引數傳入 ⑤必須使用post方法來發送Ajax請求 ⑥需要將fd物件作為引數傳入send
4.檔案上傳進度條
核心事件: ==xhr.uplload.onprogress ==
onprogress事件大約每100ms觸發一次,該事件物件中有loaded和total兩個重要屬性
loaded:已上傳檔案大小;
total:檔案總大小