加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

jquery ajax分页插件的简单实现

发布时间:2020-12-15 23:28:37 所属栏目:百科 来源:网络整理
导读:说到基于jQuery的ajax分页插件,那我们就先看看主要的代码结构: 1、首先定义一个pager对象: 对象包含了分页的属性及用到的方法,doPage()为分页的核心方法。 2、进行jQuery扩展 3、插件使用 table id="dataTable" border="1px"/table div id="pager" $('#d

说到基于jQuery的ajax分页插件,那我们就先看看主要的代码结构:

1、首先定义一个pager对象:

对象包含了分页的属性及用到的方法,doPage()为分页的核心方法。

2、进行jQuery扩展

3、插件使用

<table id="dataTable" border="1px"></table>
<div id="pager">

$('#dataTable').html(tableStr); },complete: function () { }

});

})

有没有发现使用方式与直接使用ajax基本是一样一样的?

最后我们可以看下出来的效果:(表格样式没有设置比较丑,分页样式自己也可以根据需要修改css文件)

F12打开调试工具,点击分页查看发送的请求及响应:

  pageIndex和pageSize为插件默认的参数,在后台可以直接在Request中获取。特别需要注意的是插件的响应也是需要遵循特定的格式{"total":0,"items":[]},如上图中所示total代表数据总记录数,items代表分页的数据。

  这里只有代码的大体结构及呈现的效果,大家不妨自己先动手实现一下。

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读