web-dev-qa-db-ja.com

画像アイコンをBootstrap SelectOptionsに追加する方法

アイコン/画像をBootstrap SelectOptionsに追加できるかどうか疑問に思います。
私はすでに [〜#〜] here [〜#〜] のオプションにbackground-imageを追加してこれを試しています

<select class="span2">
            <option>1</option>
            <option style="background-image:url(slider-dot.png);">2</option>
            <option>3</option>
</select>

しかし、それは機能していません!これが可能かどうか教えていただけますか?ありがとう

7
dsdsd

私の知る限り、組み込みのbootstrap設定を使用してオプション要素にアイコンを追加することはできません。ただし、bootstrapを行うために構築されたプラグインがあります)この機能は、bootstrap selectコンポーネントに追加のカスタマイズオプションも追加します。これはbootstrap-selectと呼ばれます。

このプラグインに使用されるアイコンは、ブートストラップによって提供されるグリフィコンから直接ロードされます。

編集:jsFiddleの例のリンクを参照してください: http://jsfiddle.net/YW8MV/5/

関連するJavaScriptは次のとおりです。

$('.selectpicker').selectpicker({
    style: 'btn-primary',
    showIcon: true,
    title: 'select test'
});