Ajax<二>

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:文件总大小