asp select下拉菜单选择图标并实时显示
2018-09-06 12:20
静态方法:将下面的代码复制到<body>~</body>内
程序代码
<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=个人形象代表 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>--> 静态</td>
</tr>
</table>
ASP数组方法:将下面的代码复制到<body>~</body>内
程序代码
<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=个人形象代表 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 数组 </td>
</tr>
</table>
共同点:
1、<img id=idface src=1.gif>// 都必须在默认的图片上赋一个ID号
2、<select onChange=document.images[idface].src=options[selectedIndex].value;>// 再在下拉菜单中调用这个ID
......
</select>
不同点:
在静态的制作方法中:
程序代码
<select ......>
<option value=1.gif > 头像1 </option> // 直接在下拉菜单中的option选项中赋予路径
<option value=2.gif > 头像2 </option>
......
</select>
--------------------------------------------------------------------------------
在ASP数组 定义方法中:
程序代码
<select ......>
<% dim i // 定义数组 i
for i=1 to 20 // 定义 i 的值为1~20
%>
<option select value=<%=I%>.gif>头像<%=I%></option> // 显示第一条选项的值
<% next %> // 下一条
</select>
上一篇:图片的入库与读取的方法
下一篇:asp的一个日期格式化函数