JavaScript对下拉菜单的基本操作：

1.获取一个下拉菜单对象

Js代码 

var select = document.getElementById("selectid");


2.在下拉菜单中添加一个选项

Js代码 

var option = new Option("value","text");//第一项为值，第二项为文本域


3.把选项加入到下拉菜单中

Js代码 

select.options.add(option);


4.获取被选择的选项的索引

Js代码 

var index = select.selectedIndex;


5.获得某个选项的文本域

Js代码 

var text = select.options[index].text;

6.获得某个选项的值域

Js代码 

var value = select.options[index].value;



7.获得选中的值

Js代码 

var value = select.vlaue;



以下为实现下拉菜单联动的jsp上的代码

Js代码 

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>   
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   
<html xmlns="http://www.w3.org/1999/xhtml">   
<head><title>二级联动下拉菜单</title>   
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />   
</head>   
//这里jsp调用了bean用来从数据库读出用户需要的内容，并已string类型   
//放在list中   
<% 　　Type type = new Type(1);
　　List select1 = traintype.getSelectFirst();   
　　List select2 = traintype.getSelectSecond();%>   
<script type="text/javascript" language="javascript">   
      //二级联动菜单   
      function Select1()   
      {   
　　　　//动态生成js数组   
          var arry1 = new Array(
          <%　　　　for(int i=0;i<select1.size();i++)   
      　　{
       　　 if(i<select1.size()-1)
          　　out.print("\""+select1.get(i)+"\",");
        　　else out.print("\""+select1.get(i)+"\"");
      　　}%>);   
          var type = document.getElementById("type");   
          for(var i=0;i<arry1.length;i++)   
          {   
              var op = new Option(arry1[i],arry1[i]);   
              type.options.add(op);   
          }   
        }   
        
      function Select2()   
      {   
          var arry2 = new Array();   
          <% for(int j=0;j<select2.size();j++)   
          {   
              List templist = (List)select2.get(j);   
              %>   
        arry2[<%=j%>]=new Array(　　<%for(int k=0;k<templist.size();k++)   
      {　　　　if(k<templist.size()-1)
        　　out.print("\""+templist.get(k)+"\",");
     　　 else out.print("\""+templist.get(k)+"\"");
      }%>);   
          <%   
          }   
          %>   
          var type = document.getElementById("type");   
          var id = traintype.selectedIndex-1;   
          var name = document.getElementById("name");   
          name.innerHTML="";   
          var top = new Option("--请选择--","");   
          orgname.options.add(top);   
          var temparry = arry2[id];   
          for(var i=0;i<temparry.length;i++)   
          {   
              var op = new Option(temparry[i],temparry[i]);   
              orgname.options.add(op);   
          }   
      }   
<body onload="Select()">   
<select id="type" name="type" onchange="Select2()" >   
<option value="">--请选择--</option></select>   
<select id="type" name="type" >   
<option value="">--请选择--</option></select>   
</body>   
<html>


在用jsp写动态的下拉菜单时，只能把这部分的代码写在当前的jsp页面，这样也限制的js代码的复用。