Ajax学习笔记(1)------关于Ajax的代码

自己实践的东西,留着。
 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. < html   xmlns = "http://www.w3.org/1999/xhtml" >
  3. < head >
  4. < meta   http-equiv = "Content-Type"   content = "text/html; charset=gb2312"   />
  5. < title > Ajax 入门简介 </ title >
  6. < script    language = "javascript" >
  7. var  request  =  false ;
  8.    try {
  9.       request  =  new  XMLHttpRequest();
  10.    } catch (trymicrosoft) {
  11.      try {
  12.         request  =  new  ActiveXObject("Msxml2.XMLHTTP");
  13.      } catch (othermicrosoft) {
  14.        try {
  15.           request  =  new  ActiveXObject("Microsoft.XMLHTTP");
  16.        } catch (failed) {
  17.           request  =  false ;
  18.        }  
  19.      }
  20.    }
  21.    if (!request)
  22.      alert("Error initializing XMLHttpRequest!");
  23.    function getCustomerInfo() {
  24.      var  phone  =  document .getElementById("phone").value;
  25.      var  url  =  "/Ajax/scripts/lookupCustomer.jsp?phone="  + escape(phone);
  26.      request.open("GET", url, true);
  27.       request.onreadystatechange  =  updatePage ;
  28.      request.send(null);
  29.      }
  30. function updatePage() {
  31.      if ( request.readyState  == 4)
  32.        {if ( request.status  == 200)
  33.          {
  34.          var  response  =  request .responseText.split("|");
  35.          document.getElementById("order") .value  =  response [0];
  36.          document.getElementById("address") .innerHTML  =
  37.             response [1].replace(//n/g, "");
  38.          }
  39.        else if ( request.status  == 404)
  40.         { alert("Request URL does not exist");}
  41.          else if ( request.status  == 403) {
  42.          alert("Access denied.");
  43.        } 
  44.        else
  45.          alert("Error: status code is " + request.status);
  46.          }
  47.    }
  48. </ script >
  49. </ head >
  50. < body >
  51. < p > < img   src = "images/banner.jpg"   alt = "Break Neck Pizza"   width = "1004"   height = "300"   /> </ p >
  52. < form   action = "POST" >
  53.    < p > Enter your phone number:
  54.      < input   type = "text"   size = "14"   name = "phone"   id = "phone"  
  55.             onChange = "getCustomerInfo();"   />
  56.    </ p >
  57.    < p > Your order will be delivered to: </ p >
  58.    < div   id = "address" > </ div >
  59.    < p > Type your order in here: </ p >
  60.    < p >
  61.      < textarea   name = "order"   rows = "6"   cols = "50"   id = "order" > </ textarea >
  62.    </ p >
  63.    < p >
  64.      < input   type = "submit"   value = "Order Pizza"   id = "submit"   />
  65.    </ p >
  66. </ form >
  67. </ body >
  68. </ html >

你可能感兴趣的:(Ajax学习笔记(1)------关于Ajax的代码)