如何在下拉列表中使用图标?

时间:2011-03-18 14:08:20

标签: php jquery html css drop-down-menu

我已经研究了一段时间,但看不出怎么做。

基本上我试图在下拉列表中使用图标,例如:

<form method="get" action="testdocs-db.php" name="search" id="search" class="search">
<input type="hidden" name="dosearch" value="true">
<table width=600 border=0>
<tr>
<td>File Type:</td>
<td>
<select name="filetype" size="1" > 
<option selected>any</option> 
<option id="text">text</option> 
<option id="msword">msword</option> 
<option id="excel">excel</option> 
<option id="powerpoint">powerpoint</option> 
<option id="pdf">pdf</option> 
<option id="jpeg">jpeg</option> 
<option id="png">png</option> 
<option id="bmp">bmp</option> 
<option id="gif">gif</option> 
</select> 
</td>
</tr>
</table>

此下拉列表是表格内部的一部分,用于搜索数据库并返回结果。

非常感谢任何帮助。

此致 马丁

3 个答案:

答案 0 :(得分:3)

简短回答:你不能。

如果您想在下拉列表中使用图标,则必须使用例如无序列表制作“假”下拉菜单,并使用javascript将点击的值复制到您的(隐藏...)形式领域。

答案 1 :(得分:2)

这可以在Firefox中使用,因为它允许您在CSS中为background-image元素定义option。只有AFAIK才允许这样做。

你可以使用jQuery插件。谷歌搜索给了我this plugin for example

答案 2 :(得分:1)

使用常规HTML和CSS无法做到这一点。 DTD不允许这样做。