手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >基于jquery的无刷新分页技术
基于jquery的无刷新分页技术
摘要:复制代码代码如下:varindex=0;$(document).ready(function(){$.post("Default5.aspx...

复制代码 代码如下:

<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的无刷新分页技术】相关文章:

黑色风格的JS日历代码,左右箭头翻页年、月

使用JavaScript刷新网页的方法

jQuery实现强制cookie过期方法汇总

基于jQuery实现的无刷新表格分页实例

jquery中添加属性和删除属性

jQuery+ajax实现无刷新级联菜单示例

javascript基于DOM实现权限选择实例分析

基于jquery实现下拉框美化特效

JS+CSS实现的拖动分页效果实例

基于javascript简单实现对身份证校验

精品推荐
分类导航