asp select下拉菜单选择图标并实时显示_应用技巧

静态方法:将下面的代码复制到<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>

时间: 2024-09-17 03:58:55

asp select下拉菜单选择图标并实时显示_应用技巧的相关文章

asp select下拉菜单选择图标并实时显示

静态方法:将下面的代码复制到<body>~</body>内 程序代码 <table cellpadding="2" width="226" cellspacing="2" border="0" > <tr> <td width="32" align="right"><img id=idface src="....

jQuery实现非常实用漂亮的select下拉菜单选择效果_jquery

本文实例讲述了jQuery实现非常实用漂亮的select下拉菜单选择效果.分享给大家供大家参考,具体如下: 先来看如下运行效果截图: 在线演示地址如下: http://demo.jb51.net/js/2015/js-select-chose-style-menu-codes/ 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtm

php-html下拉菜单选择的问题

问题描述 html下拉菜单选择的问题 新手,临时被安排写html,涉及到筛选问题,第一个下拉菜单可以通过我预设的值,就称为type吧,type有123456几个大类,第二个下拉菜单是根据php链接mysql查出来的一堆数据,需要在选择第一个下拉菜单后,第二个下拉菜单根据第一个的type来判断,并筛选出应该显示的数据来供使用者的第二次选择,最后点击查询按钮时这两个下拉菜单的值都需要传值到php后端,求帮助,谢谢 解决方案 用jquery的combobox吧 都可以搞的 解决方案二: 可以使用级联,

基于jQuery的select下拉框选择触发事件实例分析_jquery

本文实例讲述了基于jQuery的select下拉框选择触发事件实现方法.分享给大家供大家参考,具体如下: 我一直以来都认为,select 下拉框选择对选项 options 使用 onclick 注册事件即可,如下: <select> <option value="0" onclick="func(0)">选项一</option> <option value="1" onclick="func(1

select下拉框-select下拉菜单option在google手机模拟器有一半黑屏 一半正常显示

问题描述 select下拉菜单option在google手机模拟器有一半黑屏 一半正常显示

隐藏-Ext 根据下拉框选择不同的值 显示不同的文本框

问题描述 Ext 根据下拉框选择不同的值 显示不同的文本框 Ext 根据下拉框选择不同的值 显示不同的文本框 只显示了文本框没有显示fieldLabel Ext.onReady(function(){ this.username = { id:'usernameId', tabIndex:4, xtype:'textfield', fieldLabel: '密码', cls:'x-upper-text', width:80, name: 'username', maxLength:25, upp

jquery下拉菜单在浏览器中只显示1像素,求大神帮帮忙

问题描述 jquery下拉菜单在浏览器中只显示1像素,求大神帮帮忙 本人小菜鸟一枚,用jquery写了个简单的下拉菜单,代码如下:$(document).ready(function(){ $(""#navRight .jiantou"").hover(function(){ $(this).find("".xiangq"").stop().slideDown(""slow""); }f

html5-如何用HTML和CSS编写一个导航下拉菜单,要鼠标经过显示

问题描述 如何用HTML和CSS编写一个导航下拉菜单,要鼠标经过显示 如题如何用HTML和CSS编写一个导航下拉菜单,要鼠标经过显示,只要一个就行 解决方案 hover就好了,ie6-不支持,不过也不需要考虑ie6了.. <!doctype html> <style> ul.menu, ul.menu li{margin:0px;padding:0px;list-style:none;position:relative;} ul.menu li{line-height:25px}

jQuery结合CSS制作漂亮的select下拉菜单

  对于我来说,标准的HTML元素(Select)已经让我感到讨厌.它不能够正常的在IE浏览器上显示.还有一点就是他并不仅仅包含简单的文本.本实例将完全摒弃select元素,通过JQuery和CSS来构建DropDown元素. 我们在进行表单设计时,可能要用到select下拉选项控件,遗憾的是,IE浏览器默认的select控件外观非常丑陋,而且不能用样式来控制,不能在选项中添加图片等信息.今天我将通过实例来讲解如何用CSS和jQuery来制作漂亮的下拉选项菜单. XHTML ? 1 2 3 4