魚躍于淵

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

          ajax 做圖片幻燈片

          Posted on 2008-09-24 16:01 魚躍于淵 閱讀(387) 評論(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

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


          網站導航:
           
          主站蜘蛛池模板: 肃北| 中江县| 鹿邑县| 弥勒县| 阿坝县| 和平区| 巴东县| 吕梁市| 昌邑市| 上林县| 松滋市| 潍坊市| 宿迁市| 抚顺市| 门源| 荔浦县| 那曲县| 尉氏县| 安义县| 关岭| 松潘县| 厦门市| 南和县| 大英县| 五原县| 青铜峡市| 清新县| 库伦旗| 西昌市| 高碑店市| 胶南市| 平塘县| 富蕴县| 岢岚县| 临邑县| 平武县| 德江县| 佛山市| 虎林市| 乌兰察布市| 汉寿县|