說明:
select標籤主要是兩點,一個是相關js函數,一個是option標籤.
本示列中還包含有一個隱藏的select,用於在js函數中調用.這裡考慮到載入的速度及順序問題,以避免在js函數中直接使用java代碼帶來的問題.
/*jsp內容*/
<div style="width:40%; float:left;">
<img src="<%=request.getContextPath() %>/<%=cssDir %>/img/san_funarea_search.png" width="14" height="14" align="absmiddle" />請選取查詢類型
<select name="field" class="select" onChange="showNext()" >
<option value="CARNO" <%if(field.equals("CARNO")) out.print("selected"); %>>車牌號</option>
<option value="CARNAME" <%if(field.equals("CARNAME")) out.print("selected"); %>>車輛名稱</option>
<option value="DEPTNAME" <%if(field.equals("DEPTNAME")) out.print("selected"); %>>部門</option>
</select>
</div>
<div style="width:60%; float:right;" id="myDiv"></div>
//隱藏select
<div>
<select id="dept" name="dept" class="select" style="display:none">
<option value="">請選擇</option>
<%
ResultSet getDeptRs = db.executeQuery("select t.dept,t.deptname from pub_dept_manager t where unit='"+cua.getUnitCode()+"' and parentcode='"+cua.getUnitCode()+"'");
while(getDeptRs.next()){
if(keyvalue.equals(getDeptRs.getString(2)))
out.print("<option value='"+getDeptRs.getString(2)+"' selected>"+getDeptRs.getString(2)+"</option>");
else
out.print("<option value='"+getDeptRs.getString(2)+"'>"+getDeptRs.getString(2)+"</option>");
}
getDeptRs.close();
%>
</select>
</div>
<script language="JavaScript">
//查詢跳轉
var keyvalue = "<%=keyvalue%>";
var yearvalue = "<%=yearvalue%>";
var year ="<%=year%>";
//根據選擇不同的查詢條件,顯示輸入關鍵字的文字框或者下拉框
function showNext(){
if ( year =="currentyear"){
//從上個頁面傳過的year值不為空白,且為字串"currentyear"
yearvalue = "<%=currentYear%>";
}
var selectvalue = document.form1.field.options[document.form1.field.selectedIndex].value;
myDiv.innerHTML='<table cellpadding="0" cellspacing="0" border=0><tr><td>'
+'關鍵字: <input size="15" name="keyvalue" type="text" id="keyvalue" title="請輸入要尋找的關鍵字" value="'+keyvalue+'">'
+'</td><td> 年份:'
+'<input size="6" name="yearvalue" type="text" des="年份" id="yearvalue" maxlength="4" dtype=year title="請輸入要尋找的年份" value="'+yearvalue+'"></td>'
+'<td><a href="javascript: query();" class="main_fun_button" >查詢</a></td></tr></table>';
//角色類別
if(selectvalue == "DEPTNAME"){
myDiv.innerHTML='<table cellpadding="0" cellspacing="0" border=0><tr><td>'
+'關鍵字:<select id="keyvalue" name="keyvalue" class="select" >'+document.all.dept.innerHTML
+'</select></td><td> 年份:'
+'<input size="10" name="yearvalue" type="text" des="年份" id="yearvalue" maxlength="4" dtype=year title="請輸入要尋找的年份" value="'+yearvalue+'"></td>'
+'<td><a href="javascript: query();" class="main_fun_button" >查詢</a></td></tr></table>';
}
keyvalue="";
yearvalue ="";
if(document.form1.keyvalue!=null)
document.form1.keyvalue.focus();
}
</script> 相關js函數