DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> jQuery入門知識 >> JQuery特效代碼 >> 基於jquery的無刷新分頁技術
基於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>
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved