原生ajax readystatechange事件請求失敗 onload成功的原因分析
阿新 • • 發佈:2019-02-07
用ajax連結後臺介面,請求失敗。引數檢查沒問題,請求得到的responseText也做了物件處理。把onreadystatechange改成onload事件後,請求成功。
xhr.open("get",url,true); xhr.send(); xhr.onload= function () { if(xhr.status >=200 && xhr.status < 300 ||xhr.status ==304){ alert(xhr.responseText); alert("請求成功"); } else { alert("失敗原因:"+xhr.status); } }
原因是onreadystatechange事件有跨瀏覽器相容性的問題,它必須放在在xhr.open()之前。
否則,就會出現請求失敗,而xhr.onload()事件則可以寫在xhr.open()的後面,所以,上個例子如果想使用onreadystatechange來實現,把xhr.open()和xhr.send()放到最後,然後把onload改成onreadystatechange,加if(xhr.readyState ==4){}即可。程式碼如下:
xhr.onreadystatechange= function () { if(xhr.readyState == 4){ if(xhr.status >=200 && xhr.status < 300 ||xhr.status ==304){ alert(xhr.responseText); } else { alert("失敗原因:"+xhr.status); } } xhr.open("get",url,true); xhr.send(); }