jQuery技术

基于jquery的无刷新分页技术

字号+ 作者:H5之家 来源:H5之家 2015-11-05 08:47 我要评论( )

基于jquery的无刷新分页技术,需要的朋友可以参考下。

基于jquery的无刷新分页技术,需要的朋友可以参考下。

复制代码 代码如下:


<script src="script/jquery-1.6.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
var index = 0;
$(document).ready(function () {
$.post("Default5.aspx", { name: index }, function (msg) {
$("tr:gt(0)").remove();
var artice = msg;
for (var i = 0; i < 5; i++) {
$("table").append("<tr><td>" + artice[i]["ID"] + "</td><td>" + artice[i]["Writer"] + "</td><td>" + artice[i]["Title"] + "</td></tr>");
}
}, "json");
});
$(document).ready(function () {
$("a").click(function () {
if ($(this).html() == "下一页") {
index = index + 5;
if (index > 10) {
index = 10;
}
}
if ($(this).html() == "上一页") {
index = index - 5;
if (index < 0) {
index = 0;
}
}
// alert(index);
$.post("Default5.aspx", { name: index }, function (msg) {
// alert(msg[0]["ID"]);
$("tr:gt(0)").remove();
var artice = msg;
for (var i = 0; i < 5; i++) {
// alert("11");
$("table").append("<tr><td>" + artice[i]["ID"] + "</td><td>" + artice[i]["Writer"] + "</td><td>" + artice[i]["Title"] + "</td></tr>");
// $("table").append("<tr><td>1</td><td>2</td><td>3</td></tr>");
}
}, "json");
});
});
</script>

您可能感兴趣的文章:
基于jquery的无刷新分页技术
BOM与DOM的区别分析
jquery+ashx无刷新GridView数据显示插件(实现分页、排序、过滤功能)
jquery用get实现ajax在ie里面刷新不进入后台解决方法
通过pjax实现无刷新翻页(兼容新版jquery)
jquery 插件 web2.0分格的分页脚本,可用于ajax无刷新分页
分享精心挑选的12款优秀jQuery Ajax分页插件和教程
分享精心挑选的12款优秀jQuery Ajax分页插件和教程
结构/表现/行为完全分离的选项卡(jquery版和原生JS版)
《Perl编程24学时教程》笔记第23课 perl实现服务器推送和访问次数计数器

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
网友点评
-