魚躍于淵

          First know how, Second know why !
          posts - 0, comments - 1, trackbacks - 0, articles - 49

          ajax 做圖片幻燈片

          Posted on 2008-09-24 16:01 魚躍于淵 閱讀(388) 評論(1)  編輯  收藏 所屬分類: 平時小練習

          <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
          <html>
          <head>
          <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
          <title>Insert title here</title>

          <script type="text/javascript">
           
           window.onload=initAll ;
           var xhr = false ;
           var url = "ajax02.xml" ;
           
           function initAll(){
            if(window.XMLHttpRequest){
            xhr = new XMLHttpRequest() ;
            }else{
             if(window.ActiveXObject){
              try{
               xhr = new ActiveXObject("Microsoft.XMLHttpRequest") ;
              }catch(e){}
             }
            }
            if(xhr){
             xhr.onreadystatechange = showContents ;
             xhr.open("GET", url, true) ;
             xhr.send(null) ;
            }else{
             document.getElementById("updateArea").innerHTML = "sorry ! but your pc coundn't create a xhr object !" ;
            }
            
            setTimeout("initAll()", 500) ;
           }
           
           function showContents(){
            if(xhr.readyState == 4){
             if(xhr.status == 200){
              var tempDiv = document.createElement("div") ;
              var imgDiv = document.getElementById("imgDiv") ;
              tempDiv.innerHTML = xhr.responseText ;
              var allLinks = tempDiv.getElementsByTagName("a") ;
              //alert(allLinks.length) ;
              for(i=0; i<allLinks.length; i++){
               //imgDiv.appendChild(allLinks[i].cloneNode(true)) ;
               //var br = document.createElement("br") ;
               //imgDiv.appendChild(br) ;
              }
              var imgid = Math.floor(Math.random() * allLinks.length) ;
              document.getElementById("imgDiv").innerHTML = allLinks[imgid].innerHTML ;
              
             }else{
              var outMsg = "there was a problem on your server : status = " + status ;
             }
            }
           }

          </script>

          </head>
          <body>
          <center>
           <div id="imgDiv"></div>
          </center>
          </body>
          </html>

          XML 文件為 :

          <?xml version="1.0" encoding="UTF-8"?>
          <author>
           <entry>
            <a href="jason1"><img width="100" height="100" border="0" src="images/1.jpg" /></a>
           </entry>
           <entry>
            <a href="jason1"><img width="100" height="100" border="0"  src="images/2.jpg" /></a>
           </entry>
           <entry>
            <a href="jason1"><img width="100" height="100" border="0" src="images/3.jpg" /></a>
           </entry>
           <entry>
            <a href="jason1"><img width="100" height="100" border="0" src="images/4.jpg" /></a>
           </entry>
           <entry>
            <a href="jason1"><img width="100" height="100" border="0" src="images/5.jpg" /></a>
           </entry>
          </author>

          Feedback

          # re: ajax 做圖片幻燈片[未登錄]  回復  更多評論   

          2009-02-16 12:43 by ^_^
          NICE

          只有注冊用戶登錄后才能發表評論。


          網站導航:
           
          主站蜘蛛池模板: 丹巴县| 芦溪县| 渭南市| 安义县| 郓城县| 东安县| 吉安市| 漯河市| 乐平市| 韶山市| 丽水市| 谷城县| 乌鲁木齐县| 揭阳市| 巴彦淖尔市| 乌海市| 呼伦贝尔市| 新沂市| 获嘉县| 长汀县| 赤峰市| 兰溪市| 诏安县| 江陵县| 南丰县| 同江市| 同仁县| 镇安县| 黔江区| 建昌县| 嘉黎县| 云霄县| 石家庄市| 洪雅县| 神池县| 平昌县| 海口市| 肇州县| 龙岩市| 固始县| 锡林浩特市|