Juqery 级联菜单

转:
http://www.blogjava.net/Reg/archive/2009/11/15/302383.html


DemoServlet


package com.common;

import java.io.IOException;
import java.io.PrintWriter;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class DemoTest extends HttpServlet {


private IDemo demo=new Demo();

public void doGet(HttpServletRequest request, HttpServletResponse response)
   throws ServletException, IOException {

  doPost(request, response);
}


public void doPost(HttpServletRequest request, HttpServletResponse response)
   throws ServletException, IOException {
  request.setCharacterEncoding("utf-8");
  response.setCharacterEncoding("utf-8");
  response.setContentType("text/html");
  PrintWriter out = response.getWriter();
  int id=Integer.parseInt(request.getParameter("id"));
  List list=demo.query(id);
  String json="";
  for (int i = 0; i < list.size(); i++) {
   json+=list.get(i)+",";
  }
  System.out.println(json);
  out.write(json);
  out.flush();
  out.close();
}

}


Demo.jsp
<script type="text/javascript">
$(document).ready(function(){
  var s1Obj = document.getElementById("s1");
  var s2Obj = document.getElementById("s2");
  var tempValue = s1Obj.value;
 
  $.get('/Demo/DemoTest',{id:tempValue},function(x){
   var temp=x.split(',');
   for(var i=0;i<temp.length-1;i++){
    var tempOption = document.createElement("option");
    tempOption.value = temp[i];
    tempOption.innerHTML  = temp[i];
    s2Obj.appendChild(tempOption);
   }
  });
});

function leve(){
  var s1Obj = document.getElementById("s1");
  var s2Obj = document.getElementById("s2");
  var tempValue = s1Obj.value;
  s2Obj.innerHTML = '';
  $.get('/Demo/DemoTest',{id:tempValue},function(x){
   var temp=x.split(',');
   for(var i=0;i<temp.length-1;i++){
    var tempOption = document.createElement("option");
    tempOption.value = temp[i];
    tempOption.innerHTML  = temp[i];
    s2Obj.appendChild(tempOption);

   }
  });
 
 
}
  
  </script>
<body>
  <select name="s1" id="s1" onchange="leve();">
   <option value='1'>
    市场部
   </option>
   <option value='2'>
    财务部
   </option>
   <option value='3'>
    劳务部
   </option>
  </select>
  <select name="s2" id="s2">
  </select>
</body>

你可能感兴趣的:(html,json,jsp,.net,servlet)