发送GET请求，二级级连下拉菜

来源：互联网发布：电脑文档加密软件编辑：程序博客网时间：2024/06/18 16:56

通常情况下，GET请求用于从服务器上获取上获取数据，POST请求用于向服务器发送数据。GET请求将所有请求参数转换成一个查询字符串，并将该字符串添加到请求的URL之后，因而页面可在请的URL后看到请求参数名、请求参数值。如果将某个表单的action属性设置为GET，则请求的URL后看到参数名、请求数值。如果将某个表单的action属性设置为GET，则请求会将表单中各字段的名和值转换成字符串，并附加到URL之后。

采用GET请求将父菜单的ID作为参数发送，下面是服务器的响应页面，此处并未让服务务器的响应页面，此处并未让服务器响应页面从数据库读取-------后台数据库访问可仿照传统Java EE架构。服务器页面的代码如下。

second.jsp页面

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>  <%  String idStr =(String)request.getParameter("id");  int id = idStr == null ? 1 :Integer.parseInt(idStr);  System.out.println(id);  switch(id){    case 1:  %>  上海$广州$北京  <%   break;  case 2:  %>   华盛顿$纽约$旧金山   <%   break;   case 3:       %>    东京$大板$福冈    <%    break;    }         %>

first.html页面

<!DOCTYPE html><html>  <head>    <title>first.html</title>    <meta name="keywords" content="keyword1,keyword2,keyword3">    <meta name="description" content="this is my page">    <meta name="content-type" content="text/html; charset=UTF-8">        <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->  </head>    <body><select name="first" id="first" onchange="change(this.value);"><option value="1" selected="selected">中国</option><option value="2">美国</option><option value="3">日本</option></select><select name="second" id="second"></select><script type="text/javascript">function createXMLHttpRequest(){if(window.XMLHttpRequest){xmlrequest = new XMLHttpRequest();}else if(window.ActiveXObject){try{xmlrequest = new ActiveXObject("Msxml2.XMLHTTP");}catch(e){try{xmlrequest = new ActiveXObject("Microsoft.XMLHTTP");}catch(e){}}}}<strong></strong>function change(id){createXMLHttpRequest();var uri="second.jsp?id="+id;xmlrequest.onreadystatechange = processResponse;xmlrequest.open("GET",uri,true);xmlrequest.send(null);}function processResponse(){if(xmlrequest.readyState == 4){if(xmlrequest.status == 200){var cityList = xmlrequest.responseText.split("$");var displaySelect = document.getElementById("second");displaySelect.innerHTML =null;for(var i = 0;i< cityList.length ; i++){var op = document.createElement("option");op.innerHTML = cityList[i];//将新的选项添加到列表框的最后displaySelect.appendChild(op);}}<strong></strong>else{//页面不正常window.alert("您所请求的页面有异常.");}}}</script>  </body></html><strong></strong>

0 0