ASCII码 ASCII码

AJAX 自学练习 请求与显示

发布于：2022-04-02 10:30:43  栏目：技术文档
  1. AJAX 自学练习 请求与显示
  1. 主要功能输入 城市代码触发发送请求最终返回城市名称。
  2. 如下：
  3. request.jsp
  2. <%@ page language="java" contentType="text/html; charset=ISO-8859-1" 
  3. pageEncoding="ISO-8859-1"%> 
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
  5. <html> 
  6. <head> 
  7. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
  8. <title>Insert title here</title> 
  9. <script language="javascript"><!-- 
  10. function GetXmlHttpObject(){ 
  11.     var xmlHttp = null; 
  12.     try{ 
  13.         xmlHttp = new XMLHttpRequest(); 
  14.     }catch(e){ 
  15.         try{ 
  16.             xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); 
  17.         }catch(e){ 
  18.             xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 
  19.         } 
  20.     } 
  21.     return xmlHttp; 
  23. } 
  24. function showMsg(str){ 
  25.     xmlHttp = GetXmlHttpObject(); 
  26.     if(xmlHttp == null){ 
  27.         alert ("you browser don't support the ajax"); 
  28.          return; 
  30.     } 
  31.     var url = "response.jsp"; 
  32.     url = url + "?q="+ str; 
  33.     url = url + "&sid ="+ Math.random(); 
  34.     xmlHttp.onreadystatechange = stateChanged; 
  35.     xmlHttp.open("GET", url, true); 
  36.     xmlHttp.send(null); 
  37. } 
  38. function stateChanged() 
  39. { 
  40.     if(xmlHttp.readyState==4) 
  41.     { 
  42.         document.getElementById("city").value = xmlHttp.responseText; 
  43.     } 
  44. } 
  45. // --></script> 
  46. </head> 
  47. <body> 
  48. <form name="form1" action="" method="post"> 
  49.     <label >City Code:</label> 
  50.     <input type="text" name="code" onblur = "showMsg(this.value)" /> 
  51.     <br></br> 
  52.     <label>City Name:</label> 
  53.     <input type="text" name="city" id="city" ></input> 
  54. </form> 
  55. </body> 
  56. </html>
  1. response.jsp
  2. <%@ page language="java" contentType="text/plain; charset=UTF-8" 
  3. pageEncoding="UTF-8"%> 
  4. <%@ page import="com.lwf.eus.util.*,java.util.*,com.lwf.eus.entity.*,com.lwf.eus.bean.*" %> 
  5. <% 
  6. String code = request.getParameter("q"); 
  7. System.out.println(code); 
  8. if(code.equals("140")) 
  9.     out.print("上海"); 
  10. else if(code.equals("150")) 
  11.     out.print("北京"); 
  12. else if(code.equals("160")) 
  13.     out.print("天津"); 
  14. else 
  15.     out.print("未知地"); 
  16. %>
  1. 这里要注意的是由于返回的结果要在文本框中显示，因此在response.jsp中没有<html>等标签，因为测试发现如果有这些标签的话，在cityname文本框中这些标签也会显示。
相关推荐
阅读 +

© 2020 asciim码

人生就是一场修行