待要實現的功能：頁面有兩個select下拉列表，從第一個select中選擇后，在第二個select中出現對應的列表選擇，再從第二個select中選擇后，在一個text中顯示對應的信息。兩個select和text的數據全部來自oracle數據庫，該功能用js實現。
首先我們先定義兩個select和text：
<select id="department" style="width: 80px" onChange="selectChange(this.value)">
<option value=''>-請選擇-</option>
</select>
這個是第一個select，用來選擇員工所在的部門，其中注意后面那個onChange方法。這個就是當你選擇了一個選項后，調用函數selectChange()，這個函數是在js里用來實現聯動第二個select的。
<select id="empl" style="width: 100px" onChange="showName(this.value)">
<option value=''>-請選擇-</option>
</select>
這個是第二個select用來選擇員工，在onChange方法中的函數也是在js中自己定義的用來實現在text中顯示相應信息的函數。
<input type="text" name="emplInfo" value="這里顯示員工信息" size="15" maxlength="50">
在數據庫中有下表：
create table department(
dept_no varchar2(4),
dept_name varchar2(20)
)
create table empl_Info(
empl_no varchar2(8),
empl_name varchar2(10),
dept_no varchar2(4),
empl_text varchar2(50)
)
簡單定義了一個，第一張表是部門表，在第一個select中顯示，第二個表是員工信息表，在第二個select中顯示，然后在text中顯示empl_text中的信息。
下面是js中的實現：
array = new Array();
<%
int count = 0;
rs=stmt.executeQuery("select e.empl_no, e.empl_name, e.dept_no, e.empl_text from department d, empl_Info e where d.dept_no=e.dept_no order by e.dept_no desc");
String deptno = "";
String emplno = "";
String emplname = "";
String empltext = "";
while(rs.next()){
deptno = rs.getString("dept_no");
emplno = rs.getString("empl_no");
emplname = rs.getString("empl_name");
empltext = rs.getString("empl_text");
%>
array[<%=count%>] = new Array("<%=emplno%>","<%=emplname%>","<%=deptno%>","<%=empltext%>");
<%count++;
}
%>
這一步根據需要可以調整，為了舉例方便，這是在頁面加載時完成的，所以如果數據很多，加載速度有些慢。之后我們要取的數據就可以從array中讀取了。
function init(){
document.getElementByIdx_x("department").length = 1;
<%
rs=stmt.executeQuery("select * from department order by dept_no desc");
String dno="";
String dname="";
while(rs.next()){
dno= rs.getString(1);
dname= rs.getString(2);%>
document.getElementByIdx_x("department").options[document.getElementByIdx_x("department").length] = new Option("<%=dno%> <%=dname%>");
document.getElementByIdx_x("department").options[document.getElementByIdx_x("department").length-1].value="<%=dno%>";
<%}%>
}
function selectChange(id){
document.getElementByIdx_x("empl").length = 1;
for(var i = 0;i<array.length;i++){
if(array[i][2] == id){
document.getElementByIdx_x("empl").options[document.getElementByIdx_x("empl").length] = new Option(array[i][0]+ " "+array[i][1]);
document.getElementByIdx_x("empl").options[document.getElementByIdx_x("empl").length-1].value=array[i][0];
}
}
}
function showName(id){
document.getElementByIdx_x("emplInfo").value = array[id-1][1];
}
以上完成，代碼在文本中重新進行過編輯，如果有錯誤請指出。為毛發布之后會多出來一些字？那個_x是神馬啊？