<rt id="bn8ez"></rt>
<label id="bn8ez"></label>

  • <span id="bn8ez"></span>

    <label id="bn8ez"><meter id="bn8ez"></meter></label>

    posts - 22,comments - 35,trackbacks - 0

    利用XML的數(shù)據(jù)綁定和瀏覽器的自動(dòng)顯示功能可以實(shí)現(xiàn)一個(gè)無(wú)刷新的數(shù)據(jù)瀏覽,即前后翻頁(yè)、頁(yè)碼定位的功能,本人實(shí)現(xiàn)時(shí)采用JSP+XML的方式。
    具體的效果可以參看:http://guide.pconline.com.cn/comment/topic.jsp?id=10178
    相關(guān)內(nèi)容:
      通過(guò)數(shù)據(jù)綁定,可以把一個(gè)XML文檔鏈接到一個(gè)HTML頁(yè),然后綁定標(biāo)準(zhǔn)的HTML元素,例如SPAN、TABLE,到獨(dú)立的XML元素。HTML元素會(huì)自動(dòng)顯示所綁定的XML元素的內(nèi)容。
      使用數(shù)據(jù)綁定的兩個(gè)主要步驟:
      1)鏈接X(jué)ML文檔到想要顯示XML數(shù)據(jù)的HTML頁(yè)。
         有兩種方法:
           (A)通過(guò)在HTML頁(yè)中包括名為XML的HTML元素來(lái)完成。例如:<XML ID="dsoBook" SRC="Book.xml"></XML>,HTML頁(yè)中的某個(gè)元素(dsoBook)把XML文檔中Book.xml鏈接到該頁(yè)。
           (B)使用數(shù)據(jù)島的方法。例如:
               <HTML><HEAD>
                <TITLE></TITLE>
               </HEAD>
               <BODY><XML ID="dsoInventory">...</XML>
               </BODY></HTML>
      2)綁定HTML元素到XML元素。當(dāng)綁定一個(gè)HTML元素到一個(gè)XML元素時(shí),HTML元素會(huì)自動(dòng)顯示所綁定的XML元素的內(nèi)容。例如:<SPAN DATASRC="#dsoBook" DATAFLD="AUTHOR"></SPAN>,結(jié)果,HTML元素SPAN顯示元素AUTHOR的內(nèi)容。
      下面是一個(gè)XML數(shù)據(jù)綁定的例子:
    ?  <!-- File Name: Inventory Table.htm -->
    ?<HTML>
    ?<HEAD>
    ??? <TITLE>Book Inventory</TITLE>
    ?</HEAD>
    ?<BODY>
    ??? <XML ID="dsoInventory" SRC="Inventory.xml"></XML>
    ??? <H2>Book Inventory</H2>
    ??? <TABLE DATASRC="#dsoInventory" BORDER="1" CELLPADDING="5">
    ?????? <THEAD>
    ?? <TH>Title</TH>
    ?? <TH>Author</TH>
    ?? <TH>Binding</TH>
    ?? <TH>Pages</TH>
    ?? <TH>Price</TH>
    ?????? </THEAD>????
    ?????? <TR ALIGN="center">
    ?? <TD><SPAN DATAFLD="TITLE"
    ????? STYLE="font-style:italic"></SPAN></TD>
    ?? <TD><SPAN DATAFLD="AUTHOR"></SPAN></TD>
    ?? <TD><SPAN DATAFLD="BINDING"></SPAN></TD>
    ?? <TD><SPAN DATAFLD="ID"></SPAN></TD>
    ?? <TD><SPAN DATAFLD="PRICE"></SPAN></TD>
    ?????? </TR>
    ??? </TABLE>
    ?</BODY>
    /////////////////////////////////////////////////////
    ?<?xml version="1.0"?>
    ?<!-- File Name: Inventory.xml -->
    ?<INVENTORY>
    ??? <BOOK>
    ?????? <TITLE>The Adventures of Huckleberry Finn</TITLE>
    ?????? <AUTHOR>Mark Twain</AUTHOR>
    ?????? <BINDING>mass market paperback</BINDING>
    ?????? <ID>298</ID>
    ?????? <PRICE>$5.49</PRICE>
    ??? </BOOK>
    ??? <BOOK>
    ?????? <TITLE>Leaves of Grass</TITLE>
    ?????? <AUTHOR>Walt Whitman</AUTHOR>
    ?????? <BINDING>hardcover</BINDING>
    ?????? <ID>462</ID>
    ?????? <PRICE>$7.75</PRICE>
    ??? </BOOK>
    ?</INVENTORY>
    ////////////////////////////////////////////////////////////
    利用XML數(shù)據(jù)綁定實(shí)現(xiàn)頁(yè)面無(wú)刷新的數(shù)據(jù)瀏覽具體做法:
    1)在XML.jsp中建立數(shù)據(jù)島。<XML id="dsoInventory" src="xmlsrc.jsp" ></XML>,其中xmlsrc.jsp文件是通過(guò)訪問(wèn)數(shù)據(jù)庫(kù)后返回XML格式的數(shù)據(jù),實(shí)現(xiàn)時(shí)應(yīng)該包含求總記錄數(shù)據(jù)、每頁(yè)顯示條數(shù)、總頁(yè)數(shù)、分頁(yè)返回?cái)?shù)據(jù)等方法。
     返回的數(shù)據(jù)格式如:
    ?<?xml version="1.0" encoding="GBK" ?>
    ?<INVENTORY>
    ?<onePageRows>5</onePageRows>
    ?<totalRows>21</totalRows>
    ?<totalPages>5</totalPages>
    ?<intCurrentPage>1</intCurrentPage>
    ? <BOOK>
    ?<TITLE>The Adventures of Huckleberry Finn</TITLE>
    ?<AUTHOR>Mark Twain</AUTHOR>
    ?<BINDING>mass market paperback</BINDING>
    ?<ID>298</ID>
    ?<PRICE>$5.49</PRICE>
    ?</BOOK>
    ?<BOOK>
    ?<TITLE>Leaves of Grass</TITLE>
    ?<AUTHOR>Walt Whitman</AUTHOR>
    ?<BINDING>hardcover</BINDING>
    ?<ID>462</ID>
    ?<PRICE>$7.75</PRICE>
    ?</BOOK>
    ?</INVENTORY>
    使用時(shí)可以根據(jù)具體情況返回相應(yīng)的XML數(shù)據(jù)。
    2)在頁(yè)內(nèi)綁定HTML元素到XML元素,借助TABLE顯示。
    <table id="cmmTbl" datasrc="dsoInventory" datafld="BOOk" width="760" border="0" cellspacing="1" cellpadding="2" align="center" bgcolor="#aaaaaa"?? style="border-collapse: collapse" bordercolor="#333333" >
    ????????? <thead>
    ????????? <tr bgcolor="#FFCC66">
    ??????????? <td? HEIGHT="24" BGCOLOR="#f0f9ff" WIDTH="60" >
    ????????????? <div align="center"><b>查看</b></div>
    ??? </td>
    ??????????? <td? HEIGHT="24" BGCOLOR="#f0f9ff" WIDTH="60" >
    ????????????? <div align="center"><b>作者</b></div>
    ??? </td>
    ??? <td width="580" BGCOLOR="#f0f9ff">
    ????? <div align="center"><b>標(biāo)題</b></div>
    ??? </td>
    ??? <td? width="60" BGCOLOR="#f0f9ff">
    ????? <div align="center"><b>價(jià)格</b></div>
    ??? </td>
    ? </tr></thead>
    ? <tbody>
    ? <tr STYLE="background-color:expression(rowIndex%2==1?'#FFFFFF':'#f7f8f9')">
    ??? <td valign="top" WIDTH="60" align="center"><a? datafld="ID" target="_blank"><IMG SRC="images/xq.gif" ALT="查看" border="0"></a></td>
    ?????? <td valign="top" WIDTH="60"><span datafld="AUTHOR">作者</span></td>
    ?????? <td valign="top" width="580" ><a? datafld="ID" target="_blank"><span datafld="TITLE">標(biāo)題</span></a></td>
    ?????? <td valign="top" width="60" > <span datafld="PRICE">價(jià)格</span></td>
    ? </tr></tbody>
    </table>
    3)增加分頁(yè)按鈕和分頁(yè)控制的JAVASCRIPT語(yǔ)句。
    <form onsubmit="jump(this);return false;" method="post">
    ????????? <div align="right">
    ??????? 每頁(yè)顯示
    <input name=pageSize datasrc=#dsoInventory datafld=onePageRows size=2>條,
    ??????? 共<span datasrc=#dsoInventory datafld=totalPages></span>頁(yè)
    ??????? <span datasrc=#dsoInventory datafld=totalRows ></span>條
    ??????? <input type=submit style="width=0" >
    ??????? <input name=firstPage type=submit value=首頁(yè) onclick="pageNum.value=1">
    ??????? <input name=previousPage type=submit value=上頁(yè) onclick="pageNum.value=pageNum.value-1">
    ??????? 第<input name=pageNum datasrc=#dsoInventory datafld=intCurrentPage size=2>頁(yè)
    ??????? <input name=nextPage type=submit value=下頁(yè) onclick="pageNum.value=(pageNum.value-0)+1">
    ??????? <input name=lastPage type=submit value=尾頁(yè) onclick="pageNum.value=pageCount.value" >
    ??????? <input name=pageCount type=hidden datasrc=#dsoInventory datafld=totalPages onpropertychange="pageCount_onpropertychange(form)">
    ????? </div> </form>
    ?<script>
    ?? if(document.body == null) document.write("&nbsp;");
    </script>
    <script language="javascript">
    ? function jump(form)
    ? {
    ?articles.src="xmlsrc.jsp?onePageRows="+form.pageSize.value+"&page="+form.pageNum.value+"&time="+(new Date()).getTime();
    ?/////alert("xmlsrc.jsp?page="+form.pageNum.value+"&onePageRows="+form.pageSize.value+"&time="+(new Date()).getTime());
    ?///file://提交后返回新的XML數(shù)據(jù)。
    ? }
    ? function pageCount_onpropertychange(form)
    ? {
    ??? if(form.pageNum.value==1)
    ??? {
    ????? form.firstPage.disabled=true;
    ????? form.previousPage.disabled=true;
    ??? }
    ??? else
    ??? {
    ????? form.firstPage.disabled=false;
    ????? form.previousPage.disabled=false;
    ??? }
    ??? if(form.pageNum.value==form.pageCount.value)
    ??? {
    ????? form.nextPage.disabled=true;
    ????? form.lastPage.disabled=true;
    ??? }
    ??? else
    ??? {
    ????? form.nextPage.disabled=false;
    ????? form.lastPage.disabled=false;
    ??? }
    ? }
    </script>
    //////////////////////////////////////////////////////////////////
    <!-- File Name: xml.jsp -->
    <script>
    ?? if(document.body == null) document.write("&nbsp;");
    </script>
    <script language="javascript">
    ? function jump(form)
    ? {
    ?dsoInventory.src="xmlsrc.jsp?onePageRows="+form.pageSize.value+"&page="+form.pageNum.value+"&time="+(new Date()).getTime();
    ?//alert("xmlsrc.jsp?page="+form.pageNum.value+"&onePageRows="+form.pageSize.value+"&time="+(new Date()).getTime());
    ?//提交后返回新的XML數(shù)據(jù)。
    ? }
    ? function pageCount_onpropertychange(form)
    ? {
    ??? if(form.pageNum.value==1)
    ??? {
    ????? form.firstPage.disabled=true;
    ????? form.previousPage.disabled=true;
    ??? }
    ??? else
    ??? {
    ????? form.firstPage.disabled=false;
    ????? form.previousPage.disabled=false;
    ??? }
    ??? if(form.pageNum.value==form.pageCount.value)
    ??? {
    ????? form.nextPage.disabled=true;
    ????? form.lastPage.disabled=true;
    ??? }
    ??? else
    ??? {
    ????? form.nextPage.disabled=false;
    ????? form.lastPage.disabled=false;
    ??? }
    ? }
    </script>
    <html>
    <head>
    <title>XML無(wú)刷新提交</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    ?<link rel="stylesheet" href="css/style.css" type="text/css">
    </head>
    <body bgcolor="303880" text="#000000" leftmargin="0" topmargin="0">
    <XML id="dsoInventory" src="xmlsrc.jsp?page=1" ></XML>
    <input type="button" value="aa" onclick="alert(dsoInventory.xml)">
    <table id="cmmTbl" datasrc="dsoInventory" datafld="BOOk" width="760" border="0" cellspacing="1" cellpadding="2" align="center" bgcolor="#aaaaaa"?? style="border-collapse: collapse" bordercolor="#333333" >
    ????????? <thead>
    ????????? <tr bgcolor="#FFCC66">
    ??????????? <td? HEIGHT="24" BGCOLOR="#f0f9ff" WIDTH="60" >
    ????????????? <div align="center"><b>查看</b></div>
    ??? </td>
    ??????????? <td? HEIGHT="24" BGCOLOR="#f0f9ff" WIDTH="60" >
    ????????????? <div align="center"><b>作者</b></div>
    ??? </td>
    ??? <td width="580" BGCOLOR="#f0f9ff">
    ????? <div align="center"><b>標(biāo)題</b></div>
    ??? </td>
    ??? <td? width="60" BGCOLOR="#f0f9ff">
    ????? <div align="center"><b>價(jià)格</b></div>
    ??? </td>
    ? </tr></thead>
    ? <tbody>
    ? <tr STYLE="background-color:expression(rowIndex%2==1?'#FFFFFF':'#f7f8f9')">
    ??? <td valign="top" WIDTH="60" align="center"><a? datafld="ID" target="_blank"><IMG SRC="images/xq.gif" ALT="查看" border="0"></a></td>
    ?????? <td valign="top" WIDTH="60"><span datafld="AUTHOR">作者</span></td>
    ?????? <td valign="top" width="580" ><a? datafld="ID" target="_blank"><span datafld="TITLE">標(biāo)題</span></a></td>
    ?????? <td valign="top" width="60" > <span datafld="PRICE">價(jià)格</span></td>
    ? </tr></tbody>
    </table>
    <form onsubmit="jump(this);return false;" method="post">
    ????????? <div align="right">
    ??????? 每頁(yè)顯示
    <input name=pageSize datasrc=#dsoInventory datafld=onePageRows size=2>條,
    ??????? 共<span datasrc=#dsoInventory datafld=totalPages></span>頁(yè)
    ??????? <span datasrc=#dsoInventory datafld=totalRows ></span>條
    ??????? <input type=submit style="width=0" >
    ??????? <input name=firstPage type=submit value=首頁(yè) onclick="pageNum.value=1">
    ??????? <input name=previousPage type=submit value=上頁(yè) onclick="pageNum.value=pageNum.value-1">
    ??????? 第<input name=pageNum datasrc=#dsoInventory datafld=intCurrentPage size=2>頁(yè)
    ??????? <input name=nextPage type=submit value=下頁(yè) onclick="pageNum.value=(pageNum.value-0)+1">
    ??????? <input name=lastPage type=submit value=尾頁(yè) onclick="pageNum.value=pageCount.value" >
    ??????? <input name=pageCount type=hidden datasrc=#dsoInventory datafld=totalPages onpropertychange="pageCount_onpropertychange(form)">
    ????? </div> </form>
    </body>
    </html>

     完成以上三步后,當(dāng)用戶進(jìn)行翻頁(yè)操作時(shí)將自動(dòng)對(duì)表格內(nèi)的數(shù)據(jù)進(jìn)行重新的XML綁定,而不刷新頁(yè)面。

    posted on 2006-06-21 17:58 kelven 閱讀(350) 評(píng)論(0)  編輯  收藏 所屬分類: 無(wú)刷新

    只有注冊(cè)用戶登錄后才能發(fā)表評(píng)論。


    網(wǎng)站導(dǎo)航:
     
    主站蜘蛛池模板: 中国一级毛片免费看视频| 国产成人免费高清在线观看| 永久免费av无码不卡在线观看| 在线免费观看污网站| 国产av无码专区亚洲av果冻传媒| 久久99亚洲网美利坚合众国| 国产亚洲欧美在线观看| 大地资源网高清在线观看免费| 成人免费无码大片A毛片抽搐| 亚洲人成图片小说网站| 亚洲高清乱码午夜电影网| 国产偷伦视频免费观看| 国产一级特黄高清免费大片| 久久久久亚洲AV成人片| 成人久久久观看免费毛片| 黄页网站免费在线观看| 亚洲国产美女精品久久久久∴| 亚洲熟女乱色一区二区三区 | 亚洲av伊人久久综合密臀性色| 亚洲高清在线mv| 国产亚洲综合久久| 毛片a级三毛片免费播放| 亚洲av综合avav中文| 黄色a三级三级三级免费看| 四虎精品视频在线永久免费观看| 国产精品亚洲αv天堂无码| 在线精品亚洲一区二区| 久久久久久久久久国产精品免费| 亚洲AV中文无码乱人伦在线视色| 亚洲一卡2卡3卡4卡国产网站| 免费成人在线视频观看| 亚洲精品第一国产综合境外资源| 亚洲 欧洲 日韩 综合在线| 6080午夜一级毛片免费看 | 69式国产真人免费视频| 亚洲中文字幕无码爆乳av中文| 色天使亚洲综合一区二区| 午夜免费福利影院| 国产成人亚洲综合一区| 免费视频爱爱太爽了| 亚洲明星合成图综合区在线|