Html 选项中的图标-引导+；字体令人讨厌

我试图在选择列表中的选项中嵌入一个图标。使用字体超级图标时，不会显示任何图标

<select>
    <option><i class="icon-camera-retro"></i> Doesn't work in option!</option>
</select>

在选项中不起作用！

我可以使用字体来实现我所需要的吗？或者我必须放弃使用字体真棒，并为每个选项做一个手动CSS背景

---

jsFIDLE:

您可以稍微作弊一下，然后让类选择：

在选项中不起作用！

显然Select2（）是将图标放入选项标签的解决方案。然而，也许是因为我缺乏知识，我无法让它工作。最后，我求助于使用列表（我也在使用引导）

---

希望这有助于了解情况。

您可以使用FontAwesome作为unicode字体，并以跨平台的方式插入图标。您只需要查找每个图标的unicode值

<select style="font-family: 'FontAwesome', Helvetica;">
    <option>&#xf083; Now I show the pretty camera!</option>
</select>

；现在我给你看漂亮的相机！

使用类似

这是一张工作票

&#xf000；玻璃纤维
&#xf001；音乐

已经给出了一个在Chrome中工作的图标解决方案

使用的代码：

function format(icon) {
    var originalOption = icon.element;
    return '<i class="fa ' + $(originalOption).data('icon') + '"></i> ' + icon.text;
}
$('.wpmse_select2').select2({
    width: "100%",
    formatResult: format
});

函数格式（图标）{
var originalOption=icon.element；
返回“”+icon.text；
}
$（'.wpmse_select2'）。选择2({
宽度：“100%”，
formatResult:格式
});

我认为还有更简单的解决方案，但你可以看看这个令人惊叹的jquery插件：，模板部分会让你感兴趣。看看这个@PSL，我在发布之前就看到了这一点，这就是为什么我提到“每个选项都有手动CSS背景”，但我更喜欢使用字体很棒的框架。是的，你说得对。我在Firefox中开发了它，它在Firefox中运行，但在Chrome中不起作用。啊，好吧。谢谢你的解决方案，我最初在chrome上试过这个，认为它不起作用，但需要一个跨浏览器的解决方案。我想我需要一个简单的背景图片最近发现了一种将图标放入标签的方法：在Chrome、Safari和Opera（Mac）中不起作用。我没有Mac，但它应该在那里起作用。有人能证实这一点吗？在Mac电脑上，它只能在Firefox中工作。这也被追踪到了：Firefox仍然是最好的。这就解决了。在Chrome/Windows7中工作。但要明白：它也适用于IE10，但只有在显示所选选项时，当所选选项被折叠时才起作用。选项列表本身没有图标。。。古怪！

$(function(){
  $("#category li a").click(function(){
    $(".category").val($(this).text());
  });
});

<select style="font-family: 'FontAwesome', Helvetica;">
    <option>&#xf083; Now I show the pretty camera!</option>
</select>

<select id="icon_select" style="width: 150px;"><option value="fa-glass">&amp;#xf000; fa-glass</option>
  <option value="fa-music">&amp;#xf001; fa-music</option>
</select>

function format(icon) {
    var originalOption = icon.element;
    return '<i class="fa ' + $(originalOption).data('icon') + '"></i> ' + icon.text;
}
$('.wpmse_select2').select2({
    width: "100%",
    formatResult: format
});