• 企业400电话
  • 微网小程序
  • AI电话机器人
  • 电商代运营
  • 全 部 栏 目

    企业400电话 网络优化推广 AI电话机器人 呼叫中心 网站建设 商标✡知产 微网小程序 电商运营 彩铃•短信 增值拓展业务
    使用&#106avascript+xml实现分页

    基于web的技术中,分页是一个老的不能再老的,但大家津津乐道的问题,随着xml技术的日渐应用,把xml应用到分页当中,也是一种可能,当然网上的教程很多,当我都是看得稀里糊涂,索性自己写一个,与大家分享、指正。
    共有两个文件tmh.htm tt.xml
    源代码如下:
    tmh.htm
    ___________________________________________________
    !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    HTML>
    HEAD>
    TITLE> New Document /TITLE>
    META NAME="Generator" CONTENT="EditPlus">
    META NAME="Author" CONTENT="">
    META NAME="Keywords" CONTENT="">
    META NAME="Description" CONTENT="">
    link rel="stylesheet" href="../website.css" type="text/css">
    /HEAD>
    BODY>

    script language="javascript">
    //****************变量相关定义**************
    //*             author:海仔               *
    //*         Email:rautinee@21cn.com      *
    //*本程序可自由传播使用,但请务必保留此信息    *
    //****************************************
    var pagenum=4; //每页显示几条信息
    var page=0 ;
    var contpage ;
    var BodyText="";
    var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
    var mode="member";
    var toolBar;
    xmlDoc.async="false"
    xmlDoc.load("tt.xml")
    //***************这个地方是你根据实际取得的字段名称来改了
    header="TABLE border=1>tr>td>姓名/td>td>图标/td>td>IP地址/td>td>email/td>td>/td>td>日期/td>td>/td>td>/td>/tr>";

    //检索的记录数
    maxNum = xmlDoc.getElementsByTagName(mode).length
        //每条记录的列数
        column=xmlDoc.getElementsByTagName(mode).item(0).childNodes
        //每条记录的列数
        colNum=column.length
        //页数
        pagesNumber=Math.ceil(maxNum/pagenum)-1;
        pagesNumber2=Math.ceil(maxNum/pagenum);
    //上一个页面
    function UpPage(page)
    {
        thePage="前一页";
        if(page+1>1) thePage="A HREF='#' onclick='Javascript:return UpPageGo()'>前一页/A>";
        return thePage;
    }
    function NextPage(page)
    {
        thePage="后一页";
        if(pagepagesNumber) thePage="A HREF='#' onclick='Javascript:return NextPageGo()'>后一页/A>";
        return thePage;
    }

    function UpPageGo(){

    if(page>0) page--;
        getContent();
        BodyText="";

    }
    //当前的页数
    function currentPage()
    {
        var cp;
        cp="当前是第 "+(page+1)+" 页";
        return cp;
    }
    //总共的页数
    function allPage()
    {
        var ap;
        ap='总共 '+(pagesNumber+1)+' 页';
        return ap
    }
    function NextPageGo()
    {
    if (pagepagesNumber) page++;

        getContent();
        BodyText="";
    }

    //显示分页状态栏
    function pageBar(page)
    {
        var pb;
        pb=UpPage(page)+"  "+NextPage(page)+"  "+currentPage()+"  "+allPage()+selectPage();
        return pb;
    }
    function changePage(tpage)
    {    

        page=tpage
        if(page>=0) page--;
        if (pagepagesNumber) page++;
        getContent();
        BodyText="";
    }
    function selectPage()
    {
        var sp;
        sp="select name='hehe' onChange='javascript:changePage(this.options[this.selectedIndex].value)'>";
        //sp="select name='hehe' onChange='alert(this.options[this.selectedIndex].value)'>";
        sp=sp+"option value=''>/option>";
        for (t=0;t=pagesNumber;t++)
        {
            sp=sp+"option value='"+t+"'>"+(t+1)+"/option>";
        }
        sp=sp+"/select>"
        return sp;
    }

    function getContent()
    {

            if (!page) page=0;
            n=page*pagenum;
            endNum=(page+1)*pagenum;
            if (endNum>maxNum) endNum=maxNum;
            BodyText=header+BodyText;
            for (;nendNum;n++)
            {

                BodyText=BodyText+"TR>";
                    for (m=0;m=colNum-1;m++)
                    {    
                        mName=column.item(m).tagName;
                        BodyText=BodyText+("TD>"+xmlDoc.getElementsByTagName(mName).item(n).text+"/TD>");
                    }
                BodyText=BodyText+"/TR>"
                mm="";
                }
                showhtml.innerHTML=BodyText+"/table>"+pageBar(page);

    BodyText=""
    }
    /script>

    div id="showhtml">/div>
    script>
    if (maxNum==0)
            {
                document.write("没有检索到合适的人才信息")
            }
        else
            {
                getContent()
            }
    /script>

    /BODY>
    /HTML>

    //下面是tt.xml的代码




    ?xml version="1.0" encoding="GB2312"?>
    rautinee>

    member id='1'>
    name>海仔/name>
    loginName>rautinee/loginName>
    email>rautinee@btamail.net.cn/email>/member>

    member id='2'>
    name>刚强/name>
    loginName>hehe/loginName>
    email>rautinee@chinamanagers.com/email>/member>

    member id='3'>
    name>金华刚/name>
    loginName>nature_it/loginName>
    email>rautinee_sea@hotmail.com/email>/member>

    member id='4'>
    name>的简强/name>
    loginName>tank/loginName>
    email>tank@163.com/email>/member>

    member id='7'>
    name>合资/name>
    loginName>kaka/loginName>
    email>kaka@eyou.com/email>/member>

    member id='6'>
    name>加个人/name>
    loginName>apple/loginName>
    email>apple@163.com/email>/member>

    member id='8'>
    name>null/name>
    loginName>sunny/loginName>
    email>rautinee@eyou.com/email>/member>

    member id='10'>
    name>宝贝/name>
    loginName>index/loginName>
    email>rautinee@21cn.com/email>/member>

    member id='12'>
    name>null/name>
    loginName>login/loginName>
    email>webmaster@chinamanagers.com/email>/member>

    member id='13'>
    name>jiang/name>
    loginName>123/loginName>
    email>japing@chianmanagers.com/email>/member>

    member id='14'>
    name>null/name>
    loginName>world/loginName>
    email>rautinee@21cn.com/email>/member>

    member id='15'>
    name>null/name>
    loginName>swallow/loginName>
    email>swallow@chinamanagers.com/email>/member>

    member id='16'>
    name>魏格/name>
    loginName>hotmail/loginName>
    email>rautinee_sea@hotmail.com/email>/member>

    member id='17'>
    name>null/name>
    loginName>wrong/loginName>
    email>wrong@chinamanagers.com/email>/member>

    member id='18'>
    name>null/name>
    loginName>leah/loginName>
    email>leah@chinamanagers.com/email>/member>

    member id='19'>
    name>null/name>
    loginName>ttth/loginName>
    email>rautinee@21cn.com/email>/member>

    /rautinee>
    目前好像是只支持>IE5.0
    如果你有什么好的方法和改进,请来信通知我,谢谢。

    ok ,just enjoy it ,and good luck

    上一篇:使用xmldom在服务器端生成静态html页面
    下一篇:包含中文字符的URL编码问题
  • 相关文章
  • 

    © 2016-2020 巨人网络通讯 版权所有

    《增值电信业务经营许可证》 苏ICP备15040257号-8

    使用&#106avascript+xml实现分页 使用,amp,#106avascript+xml,实现,