jquery 实现无刷新分页代码实现

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>


<%@page import="java.util.*"%>
<%@page import="com.siku.bean.*"%>
<%@ taglib uri="http://www.codingfarmer.com/tags" prefix="util"%>



<script type="text/javascript" src="scripts/jquery-1.4.2.min.js"></script>


<script>
    var maxpage = 1;
    var currpage = 1;
    alert(2222);
    $.ajax( {
        url : "http://121.101.216.142:8270/OMoney/Mixi_Buy?userId=29426397&type=1",
        cache : "false",
        success : function(html) {
            //update       
        maxpage = html;
        alert(maxpage);
        $("#cm").empty();
        $("#cm").append(currpage + "/" + maxpage);
    }
    });
    findAll(1);
    function home() {
        if(currpage>1){
            findAll(1);
            currpage = 1;
            document.getElementById("cm").innerHTML = currpage + "/" + maxpage;
        }       
    }
    function last() {
        if(currpage<maxpage){
            findAll(maxpage);
            currpage = maxpage
            document.getElementById("cm").innerHTML = currpage + "/" + maxpage;
        }           
    }
    function before() {
        if (currpage > 1) {
            currpage -= 1;
            findAll(currpage);
            document.getElementById("cm").innerHTML = currpage + "/" + maxpage;
        }

    }
    function next() {
        if (currpage < maxpage) {
            currpage += 1;
            findAll(currpage);
            document.getElementById("cm").innerHTML = currpage + "/" + maxpage;
        }

    }
    function getmaxpage() {
        alert(2222);
        $.ajax( {
            url : "http://121.101.216.142:8270/OMoney/Mixi_Buy?userId=29426397&type=1",
            cache : "false",
            success : function(html) {
                //update       
            maxpage = html;
            alert(maxpage);
            $("#cm").empty();
            $("#cm").append(currpage + "/" + maxpage);
        }
        });
        findAll(1);
    }
    function findAll(currpage) {

        $
                .ajax( {
                    url : "http://121.101.216.142:8270/OMoney/Mixi_Buy?userId=29426397&type=0&page="
                            + currpage,
                    cache : "false",
                    success : function(html) {
                       
                        $("#tbl").empty();
                        if (html != "") {
                            $("#tbl")
                                    .append(
                                            "<tr><td width= '324 ' align= 'center '>番号</td><td width= '191 ' align= 'center '>チャージ日時</td><td width= '271 ' align= 'center '>お預け入れ（円）</td><td width= '271 ' align= 'center '>○貨</td><td width= '271 ' align= 'center '>決済方法</td></tr>");
                            var usertaskvc = html.split("+");
                            for ( var i = 0; i < usertaskvc.length-1; i++) {

                                $("#tbl").append(
                                        "<tr id='tr" + i + "'><td>"
                                                + usertaskvc[i].split("|")[0]
                                                + "</td><td>"
                                                + usertaskvc[i].split("|")[1]
                                                + "</td><td>"
                                                + usertaskvc[i].split("|")[2]
                                                + "</td><td>"
                                                + usertaskvc[i].split("|")[3]
                                                + "</td><td>"
                                                + usertaskvc[i].split("|")[4]
                                                + "</td></tr>");

                            }

                        } else {
                            alert("没有数据!");
                        }
                    }
                });
    }
</script>


<!--top content-->
<div class="nav">
<ul>
    <li><a href="mixi_index.html">O貨購入</a></li>
    <li><a href="mixi_buy.jsp" class="cur">チャージ履歴</a></li>
    <li><a href="mixi_consume.jsp">O貨履歴</a></li>
</ul>
<div class="nav_R">所有O貨:<strong class="red"> 0</strong>
&nbsp;&nbsp;O貨購入する金額を選んでください。</div>
<div class="clear"></div>
</div>
<!--end top content-->
<table id="tbl" width="800" height="32" border="1" align="left"
    cellpadding="0" cellspacing="0" bordercolor="#0099CC" class="tablecss">
</table>


<table width="200" border="1" cellpadding="0" cellspacing="0">
    <tr align="center">
        <td><a href="#" onclick=
    home();
>home</a></td>
        <td><a href="#" onclick=
    before();
>before</a></td>
        <td><a href="#" onclick=
    next();
>next</a></td>
        <td><a href="#" onclick=
    last();
>last</a></td>
    </tr>
    <tr>
        <td colspan="4" align="center" id="cm">xx/xx</td>
    </tr>
</table>

评论

1 楼 wuzhengyan 2012-03-17  

楼主写得很好，赞一个。
http://121.101.216.142:8270/OMoney/Mixi_Buy后台代码能发出来看看？