我可以在Yii下拉列表小部件中使用一些图片而不是纯文本吗？

Question

<?php echo CHtml::dropDownList('listname', $select, array('M' => 'Male', 'F' => 'Female')); ?>

Yii网站中的示例仅显示如何使用纯文本设置选项。有没有办法用一些图片设置它？

任何帮助将不胜感激。 最好的问候！

Answer 1

Dropdownlist在客户端html中生成一个select标记，该标记不支持使用image作为选项。

要使用image作为select的选项，您可以实现以下代码：

<div style='position: relative'>
    <div class='usersel'>here to display what user select currently</div>
    <ul style='position: absolute'>
        <li><img src='1.png' /><span>text</span></li>
        <li><img src='2.png' /><span>text</span></li>
        <li><img src='3.png' /><span>text</span></li>
    </ul>
</div>

然后使用jQuery捕获外部div上的事件mousedown或mouseenter，显示内部ul子项，并将click事件绑定到li，当单击li时，将div.usersel设置为所选值。