快捷導(dǎo)航

asp select下拉菜單選擇圖標(biāo)并實(shí)時(shí)顯示

更新時(shí)間：2008年12月27日 23:24:30 作者：

直接在下拉菜單中的option選項(xiàng)中賦予路徑，用asp循環(huán)輸出

靜態(tài)方法：將下面的代碼復(fù)制到<body>~</body>內(nèi)
程序代碼
<table cellpadding="2" width="226" cellspacing="2" border="0" >
<tr>
<td width="32" align="right"><img id=idface src="..../../../bbs/images/icon/1.gif" alt=個(gè)人形象代表 width="32" height="32"></td>
<td width="30" ><font class=cha2>頭像</font></td>
<td width="69">
<select class=editbox1 onChange="document.images['idface'].src=options[selectedIndex].value;">
<option value=../../../bbs/images/icon/1.gif selected>頭像1</option>
<option value=../../../bbs/images/icon/2.gif select>頭像2</option>
<option value=../../../bbs/images/icon/3.gif select>頭像3</option>
<option value=../../../bbs/images/icon/4.gif select>頭像4</option>
<option value=../../../bbs/images/icon/5.gif select>頭像5</option>
<option value=../../../bbs/images/icon/6.gif select>頭像6</option>
<option value=../../../bbs/images/icon/7.gif select>頭像7</option>
<option value=../../../bbs/images/icon/8.gif select>頭像8</option>
<option value=../../../bbs/images/icon/9.gif select>頭像9</option>
<option value=../../../bbs/images/icon/10.gif select>頭像10</option>
<option value=../../../bbs/images/icon/11.gif select>頭像11</option>
<option value=../../../bbs/images/icon/12.gif select>頭像12</option>
<option value=../../../bbs/images/icon/13.gif select>頭像13</option>
<option value=../../../bbs/images/icon/14.gif select>頭像14</option>
<option value=../../../bbs/images/icon/15.gif select>頭像15</option>
<option value=../../../bbs/images/icon/16.gif select>頭像16</option>
<option value=../../../bbs/images/icon/17.gif select>頭像17</option>
<option value=../../../bbs/images/icon/18.gif select>頭像18</option>
<option value=../../../bbs/images/icon/19.gif select>頭像19</option>
<option value=../../../bbs/images/icon/20.gif select>頭像20</option>
</select>
</td>
<td width="69">--> 靜態(tài)</td>
</tr>
</table>
ASP數(shù)組方法：將下面的代碼復(fù)制到<body>~</body>內(nèi)
程序代碼
<table cellpadding="2" width="241" cellspacing="2" border="0" >
<tr>
<td width="32" align="right"><img id=idface1 src="..../../../bbs/images/icon/1.gif" alt=個(gè)人形象代表 width="32" height="32"></td>
<td width="30" ><font class=cha2>頭像</font></td>
<td width="62">
<select onChange="document.images['idface1'].src=options[selectedIndex].value;" class="editbox1" >
<%
dim i
for i=1 to 20
%>
<option select value="../../../bbs/images/icon/<%=I%>.gif">頭像<%=I%></option>
<%
next
%>
</select>
</td>
<td width="91"> --> ASP 數(shù)組 </td>
</tr>
</table>
共同點(diǎn)：
1、<img id=idface src="1.gif">　　　　　　　　　　　　　　　　// 都必須在默認(rèn)的圖片上賦一個(gè)ID號(hào)
2、<select onChange="document.images['idface'].src=options[selectedIndex].value;">　// 再在下拉菜單中調(diào)用這個(gè)ID
　　......
　 </select>
不同點(diǎn)：
在靜態(tài)的制作方法中：
程序代碼
　　<select ......>
　　　<option value=1.gif > 頭像1 </option> 　　　　　// 直接在下拉菜單中的option選項(xiàng)中賦予路徑
　　　<option value=2.gif > 頭像2 </option>
　　　......
　　</select>
--------------------------------------------------------------------------------
在ASP數(shù)組定義方法中：
程序代碼
　　<select ......>
　　<% dim i 　　　　　　　　　　　　　　　　　　　　　　　　　　// 定義數(shù)組 i
　　　 for i=1 to 20 　　　　　　　　　　　　　　　　　　　　　　　// 定義 i 的值為1~20
　　%>
　　<option select value="<%=I%>.gif">頭像<%=I%></option>　　　　　　// 顯示第一條選項(xiàng)的值
　　<% next %> 　　　　　　　　　　　　　　　　　　　　　　　　// 下一條
　　</select>

您可能感興趣的文章: