1

我有一个 php 循环，我试图在 select 选项标记内回显 HTML 图像源，如下所示：

foreach($recs as $i){
    if($i->isscripted == 1){
      $is = "<img src='greencheck.gif'>"; 
    }else{
      $is = "<img src='redbang.gif'>"; 
    }

   echo "<option value=".$i->id.">".$is."  ".$i->fullname."</option>";
}

图像未显示在选择列表中。我在循环之外测试了图像标签，它显示得很好。

echo "<img src='greencheck.gif'>";
4

4 回答 4

5

您无法使用纯 HTML 来完成此操作，但有一些解决方法：

  1. CSS 背景（仅在 Firefox 中有效）：

    <select>
    <option value="volvo" style="background-image:url(images/volvo.png);">Volvo</option>
    <option value="saab"  style="background-image:url(images/saab.png);">Saab</option>
    <option value="honda" style="background-image:url(images/honda.png);">Honda</option>
    <option value="audi"  style="background-image:url(images/audi.png);">Audi</option>
</select>

  2. 使用 jQuery 插件

    JavaScript 图像下拉菜单

    你厌倦了你的旧时尚下拉菜单吗？试试这个新的。图像组合框。您可以为每个选项添加一个图标。它适用于您现有的“选择”元素，或者您可以通过 JSON 对象创建。

    http://www.queness.com/resources/images/formplugin/22.gif

于 2013-09-20T15:33:11.083 回答
1

vartec的一个不错的解决方案

你可以试试，谢谢他

点击这里

于 2013-09-20T15:44:41.620 回答
1

您可以使用：

foreach($recs as $i){
    if($i->isscripted == 1){
      $is = "greencheck.gif"; 
    }else{
      $is = "redbang.gif"; 
    }

   echo "<option value=".$i->id."  style='background-image:url(".$is."); background-repeat:no-repeat; padding-left:30px;'>".$i->fullname."</option>";
}
于 2013-09-20T15:57:01.497 回答
0

你不能在里面放图像<option>，它只能接受文本选项，你需要把它拿出来，当你选择一个选项时，你可能需要做一些 javascript 或 jquery 来在其他地方显示图像。还有一些 Jquery 插件可以做到这一点，如http://designwithpc.com/Plugins/ddSlick

于 2013-09-20T15:32:52.113 回答