<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>请求错误处理</title>
</head>
<body>
<h1>AJAX请求失败处理</h1>
<input type="button" value="获取响应数据" onclick="get_data()">
<script>
function get_data() {
// 创建xhr对象
let xhr = new XMLHttpRequest()
// 设置请求方式与请求地址
// 测试1:正常请求
xhr.open('get','http://httpbin.org/get')
// 测试2:404 请求地址错误
xhr.open('get','http://httpbin.org/getfjaksfhkas')
// 测试3:网络中断 无法发送到服务端
xhr.open('get','http://httpbin.orgfasfaa/get')
//发送请求
xhr.send()
// 获取服务器响应
xhr.onreadystatechange = () =>{
//判断AJAX状态码
if (xhr.readyState == 4){
console.log(xhr.status);
}
}
// 请求失败的监听函数
xhr.onerror=()=>{
console.log("网络中断");
}
}
</script>
</body>
</html>
124.AJAX_请求错误的处理
最新推荐文章于 2023-06-05 16:14:21 发布