google-chrome - 选项组中断特殊字符

Question

我需要将 Fontawesome 中的图标添加到选择器的选项中。它工作正常，除非我使用 optgroup

<select>
    <optgroup label="group name">
        <option>opt1 &#xf042;</option>
        <option>opt2 &#xf043;</option>
    </optgroup>
    <option>opt3 &#xf042;</option>
    <option>opt4 &#xf043;</option>
</select>

这是JSfiddle .

任何想法为什么？

Answer 1

我更新了您的 fiddle 以使用外部资源。

它导入一个 javascript 文件和一个 css 文件，现在显示图标。

如果您在 FontAwesome 上注册了一个帐户，他们会向您发送一个链接。
在您的代码中尝试以下内容，看看它是否有效，我打赌它会。

<link rel="stylesheet" type="text/css" href="https://fontawesome.io/assets/font-awesome/css/font-awesome.css">
<script type="text/javascript" src="https://use.fontawesome.com/cec949909c.js"></script>