Ajax数据请求以及数据加载
2024-11-25 17:00:06
// 当前页码
let currentPage = 1;
// 点击下一页按钮时触发
$('#nextPageBtn').click(function() {
$.ajax({
url: 'https://example.com/api/page/' + currentPage,
type: 'GET',
success: function(response) {
// 处理获取到的分页数据
currentPage++; // 页码递增
},
error: function(xhr, status, error) {
// 处理错误
console.error(error);
}
});
});
实例：
<script>
var page = 1;
$(document).ready(function(){
load(page++);
});
//ajax请求数据
function load(page) {
$.ajax({
type: "get",
dataType: "json",
url: 'index.php?s=member&mod=goods&c=home&m=shared_record_data
&page='+page,
success: function(data) {
var html = '';
for(var k in data){
html += '<div class="MT_cell">\
<div class="MT_cell_bd MT_cell_primary">\
<p class="dark">' + data[k].data.name + '</p>\
<p>' + data[k].data.store + '</p>'
+ (data[k].action == 5 ? '<p class="orange">借入时间'
+ data[k].time + '</p>': '<p class="green1">归还时间'
+ data[k].time + '</p>') + '</div>\
</div>'
}
//判断请求到的对象数量
if(data.length < 10 ) {
$('#loading').css('display','block').text('我是有底线的');
$('#more').css('display','none');
}else{
$('#loading').css('display','none');
$('#more').css('display','inline');
}
$("#content_list").append(html);
},
error:function(){
});
}
</script>
<body>
<div id ="content_list" class="MT_cells" style="margin:0;"></div>
<div id="page_list"></div>
<div id="loading">加载中</div>
<a id="more" href="javascript:load(page++);" style="display:none;">加载更多</a>
</body>