TP5生成的分页是这样的
-
<ul class="pagination">
-
<li class="disabled"><span>«</span></li>
-
<li class="active"><span>1</span></li>
-
<li><a href="/index.html?page=2">2</a></li>
-
<li><a href="/index.html?page=3">3</a></li>
-
<li><a href="/index.html?page=4">4</a></li>
-
<li><a href="/index.html?page=2">»</a></li>
-
</ul>
我们只需要使用jq
-
$(function(){
-
$(function () {
-
//当分页链接被点击的时候获取到他的href 然后通过ajax去获取数据
-
$(".pagination a").click(function () {
-
$.get($(this).attr("href"),function(){
-
//将获取到的数据写入页面Body中
-
$(document.body).html(result);
-
});
-
//阻止a链接的跳转
-
return false;
-
});
-
});
-
});
还可以使用$.ajax 使用boforeSend 在里面添加等待中之类的提示信息,提升用户体验
-
$(function () {
-
$(".pagination a").click(function () {
-
var url = $(this).attr("href"); //获取点击的url
-
$.ajax({
-
url:url, //url
-
-
//使用的是layer的弹窗组件提示等待中,提升用户体验
-
beforeSend:function () {
-
layer.msg('加载数据中...',{shade:0.1,icon:16});
-
},
-
-
success:function (result) {
-
layer.closeAll(); //关闭弹窗
-
$(document.body).html(result);
-
}
-
-
});
-
//阻止a链接的跳转
-
return false;
-
});
-
});
