js实现『加载更多』功能实例 & 点击列表跳转到详情页,开发8年的老前端才知道

本文详细描述了一个使用jQuery的$.ajax方法从后台API获取新闻数据,并通过分页逻辑实现新闻列表动态加载的JavaScript函数。作者展示了如何处理数据并构造HTML片段以显示在页面上。
摘要由CSDN通过智能技术生成

function getData(offset, size) {

$.ajax({

type: ‘POST’,

url: adminUrl + ‘common/newsServer/0’,

dataType: ‘json’,

success: function (reponse) {

var data = reponse.data;

var sum = reponse.data.length;

var result = ‘’;

/业务逻辑块:实现拼接html内容并append到页面*****/

console.log(offset, size, sum);//0 4 14

/*如果剩下的记录数不够分页,就让分页数取剩下的记录数

  • 例如分页数是5,只剩2条,则只取2条

  • 实际MySQL查询时不写这个不会有问题

*/

if (sum - offset < size) {

size = sum - offset;

}

/使用for循环模拟SQL里的limit(offset,size)/

for (var i = offset; i < (offset + size); i++) {

//console.log(data[i].newsUrlImg + data[i].newsTitle + data[i].newsSummary)

result +=

  • ’+

  • ’+
  • ’+

    //

    ’+

    ’+

    ‘’+data[i].newsTitle+‘’+

    ’+data[i].newsSummary+‘

    ’+

    ‘’+

    ‘’+

    ‘’+

    ‘’

    /* result += ‘

    ’ +

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值