0

Web ページでフォント ドロップダウン リストを作成しています。各オプション要素を、それが表すフォントでスタイルしました:-

<option value="Arial, Helvetica, sans-serif" style="font-family: Arial,Helvetica,sans-serif;">Arial</option>

ドロップダウンを展開すると正しいように見えますが、項目を選択すると、選択したオプションのフォントがドロップダウンで使用されません。オプションを選択するときにフォントを更新する方法はありますか?

jsFiddle - http://jsfiddle.net/bq2d9/

4

3 に答える 3

2

追加してみてください:

onChange="this.style.fontFamily=this.value;"

http://jsfiddle.net/bq2d9/5/

ドロップダウンのフォントは Firefox では正しく表示されますが、Chrome では正しく表示されないことに注意してください。ただし、選択後は、どちらも正しいフォントでテキストを表示します。

Chrome は、各選択オプションで異なるフォントをサポートしていません。


各オプションのフォントを表示するクロスブラウザー フォント セレクターを取得するには、プラグインを取得する必要があります。

jQuery プラグインを見ると、たくさんあります。それらのどれが個別のスタイリングをサポートしているかは正確には不明です。オプションを個別にスタイルできるものをいくつか見つけることができますが、見栄えが悪いこともあります。見栄えの良いものについては、個別にスタイリングできるかどうかを判断するのが難しい場合があります.

私が見つけることができる最高のものは jQuery-Font-Chooser - https://github.com/CD1212/jQuery-Font-Chooserです。見栄えもよく、応答時間も問題ありません。

それ以外の場合、他のプラグインについては、「jquery 選択ボックス」または「jquery フォント セレクター」などを検索できます。

于 2012-09-07T14:25:06.690 に答える
2

これを試して:

http://jsfiddle.net/Rp9gp/1/

ドロップダウンのスタイルを変更するには、これを試してください:

http://jsfiddle.net/Rp9gp/2/

于 2012-09-07T14:21:51.200 に答える
0

この場合、すべてのブラウザがサポートしていない可能性のあるカスタマイズが必要であり、あなたが言及したような問題に直面するでしょう. したがって、完全にカスタマイズされたコンボボックスを使用することをお勧めします。jquery がいいかもしれません。

ComboBox プラグインへのリンクは次のとおりです: http://archive.plugins.jquery.com/plugin-tags/combobox

于 2012-09-07T14:22:36.707 に答える