如何从选项中获得 select 字体真棒图标

Question

<select id="dropdown">
    <option> <i class="fa fa-wifi"></i> </option>
    <option> <i class="fa fa-battery-full"></i> </option>
</select>
<div id="feedback"></div>

When any one of the option is selected, how can I show the selected font awesome icon in feedback div using jQuery.

Answer 1

https://jsfiddle.net/r62p5zas/ example code is here In html part u need to integrate and change font of select with font awesome then u chan show icons in select item

select{
        font-family: fontAwesome
    }

之后，你可以给你的 select 提供 onchange 事件，并将值作为字体名称，你需要在选项中编写 fonts 的代码。

<select id="dropdown" onchange="chantestge()">

    <option value='fa-wifi'>&#xf1eb; Wifi</option>
     <option value='fa-battery-full'>&#xf240; Battery</option>
</select>
<div id="feedback"></div>

然后是 js 部分，您可以使用 jquery 和 html 代码将您的结果与创建图标

function chantestge(){

  $("#feedback").html("<i class='fa "+$("#dropdown").val()+"'></i>");
}