AJAX 第一个例子

最新推荐文章于 2022-04-13 21:05:43 发布

zhigangsun

最新推荐文章于 2022-04-13 21:05:43 发布

阅读量451

点赞数

分类专栏： AJAX

本文链接：https://blog.csdn.net/zhigangsun/article/details/13017023

版权

AJAX 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Insert title here</title>
<script type="text/javascript">

    var xmlhttp;

   function createrequest() {
       if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
           xmlhttp = new XMLHttpRequest();
       } else {// code for IE6, IE5
           xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
       }
   }


   function ajaxcall() {

       createrequest();

       //var param = "target="+ "zgsun@cn.ibm.com&" + "text="+ "Owen's ajax test&"+ "app_id="+"DSW SQO Mobile";
       xmlhttp.open("GET",
                       "http://maps.googleapis.com/maps/api/geocode/xml?address=1600+Amphitheatre+Parkway,+Mountain+View,+CA&sensor=false",
                       true);

       xmlhttp.onreadystatechange = callbackxml;

       xmlhttp.send();

   }

   function callbackxml() {

       if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
           //alert("suceess");
           var x = xmlhttp.responseXML.documentElement.getElementsByTagName("address_component");
           var txt,xx,x,i;

           txt="<table border='1'><tr><th>long_name</th><th>short_name</th></tr>";
           for (i=0;i<x.length;i++)
              {
              txt=txt + "<tr>";
              xx=x[i].getElementsByTagName("long_name");
                {
                try
                  {
                  txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
                  }
                catch (er)
                  {
                  txt=txt + "<td> </td>";
                  }
                }
            xx=x[i].getElementsByTagName("short_name");
              {
                try
                  {
                  txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
                  }
                catch (er)
                  {
                  txt=txt + "<td> </td>";
                  }
                }
              txt=txt + "</tr>";
              }
            txt=txt + "</table>";
            document.getElementById('result').innerHTML=txt;
            }
          }

   function callbackjson(){
       if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
           alert("success");
       }
   }
</script>
</head>
<body οnlοad="javascript:ajaxcall();">
   <p>hello ajax</p>
   <form name="myForm" method="post" action="ajaxAction">
       用户： <input type="text" name="username" />
       时间： <input type="text" name="time" />
       <input type="button" name="submit" value="submit"/>
   </form>

   <dir id="result"></dir>
</body>
</html>