jQuery 每隔5秒钟发送一个ajax请求 请求后台数据接口
1、我们会用到：window.οnlοad=function(){} ，一个页面貌似只能用一次，可以自己去试试：
2、html代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>数据交互</title>
<script src="__JS__/jquery.min.js"></script>
</head>
<body>
<table id='table-test'>
<tr>
<th>期数</th>
<th>code码</th>
<th>和值</th>
</tr>
</table>
</body>
<script>
//假设每隔5秒发送一次请求
window.onload = function () {
getApi();
}
function getApi() {
//设置时间 5-秒 1000-毫秒 这里设置你自己想要的时间
setTimeout(getApi,5*1000);
$.ajax({
url: 'http://www.andy.com/xxx',
type: 'get',
dataType: 'json',
success: function (data) {
//方法中传入的参数data为后台获取的数据
// console.log(data.data);
var data1 = data['data']['history'];
// console.log(data1);
var tr;
$.each(data1,function (index,item) {
//字符串转数组
var code = item['code'].split(',');
//数组转字符串：
var strCode = code.join(' ');
// console.log(strCode)
tr = '<td>'+item['issue']+'</td>'+'<td>'+strCode+'</td>'+'<td>'+item['sum']+'</td>';
$('#table-test').append('<tr>'+tr+'</tr>')
})
}
})
}
</script>
</html>
3、效果图：依次每隔5秒请求一次
图一：注意看server_time
图二：还是注意看server_time
两次时间相减 = 5秒！也就是说5秒钟请求了一次接口！
4、但是不做判断的话，循环出来的值就跳入死循环了，之前这么写是为了展示效果，下面才是如果接口发过来的code=2，才每隔5秒请求一次，直到请求到最新数据，code=1，才停止请求！修改一下方法，代码如下：
function getApi() {
$.ajax({
url: 'http://www.andy.com/xxx',
type: 'get',
dataType: 'json',
success: function (data) {
//方法中传入的参数data为后台获取的数据
// console.log(data.msg);
if(data.code == 1){
var data1 = data['data']['history'];
// console.log(data1);
var tr;
$.each(data1,function (index,item) {
//字符串转数组
var code = item['code'].split(',');
//数组转字符串：
var strCode = code.join(' ');
// console.log(strCode)
tr = '<td>'+item['issue']+'</td>'+'<td>'+strCode+'</td>'+'<td>'+item['sum']+'</td>';
$('#table-test').append('<tr>'+tr+'</tr>');
})
}else {
//设置请求api接口时间
setTimeout(getApi,5*1000);
}
}
})
}
————————————————
版权声明：本文为CSDN博主「IT-Andy」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/qq_39188306/article/details/88600665
