0

現在、java スクリプトを使用して動的に作成される選択メニューがあります。

var rating = ["R","RR","RRR","RRRR","RRRRR"];
var SelectMenuBuild = '<select id="updateconditionselect">';

for (var i = 0; i < rating.length; i++) 
{
    SelectMenuBuild = SelectMenuBuild + "<option id='Condition' style='color: #eab92d; font-family: 'WebSymbolsRegular;' value='"+i+"'>"+rating[i]+"</option>";
};
SelectMenuBuild = SelectMenuBuild + "</option>";

ここに画像の説明を入力 フィールド オプションで R を使用する理由は、WebSymbolsRegular フォント ファミリの R で、R が星を表すためです。だから私は基本的に 1 から 5 までの星のドロップダウン メニューを作成しています。唯一の問題は、フォント ファミリがドロップダウン メニューに適用されていないことです。ドロップダウン メニューには星が表示され続けます。jQueryまたはjQuery Mobileがこの機能をどのようにオーバーライドしているのか、フォントファミリを機能させる方法を確信しています。

上記のコードを変更すると、次のようになります。

'<select id="updateconditionselect" style='color: #eab92d; font-family: 'WebSymbolsRegular;'>';

部分的に機能しているように見えました。私は今、次のようになります：

Rの代わりに星を表示するように選択するのはどうですか？

4

2 に答える 2

0

のようにしてみてください。

var rating = ["R","RR","RRR","RRRR","RRRRR"];
var SelectMenuBuild = '<select id="updateconditionselect" style="color: #eab92d; font-family: WebSymbolsRegular;">';

for (var i = 0; i < rating.length; i++) 
{
    SelectMenuBuild = SelectMenuBuild + "<option value='"+i+"'>"+rating[i]+"</option>";
};
SelectMenuBuild = SelectMenuBuild + "</select>";

idに追加する必要はなく、 not onoptionsにも追加style attributeします。selectoption

于 2013-07-02T10:08:54.200 に答える
0

動作中の jsFiddle の例: http://jsfiddle.net/Gajotres/sEP3Y/

CSS で内容を変更できるように、最初の選択ボックスには ID が必要です。

これが選択ボックスだとしましょう：

<div data-role="fieldcontain">
    <label for="select-choice-custom" class="select">Shipping method:</label>
    <select name="select-choice-1" id="select-choice-custom" data-native-menu="false">
        <option value="standard">Standard: 7 day</option>
        <option value="rush">Rush: 3 days</option>
        <option value="express">Express: next day</option>
        <option value="overnight">Overnight</option>
    </select>
</div>

ID #select-choice-custom を持っています。jQuery Mobile が選択ボックスを作成するとき、それはカスタム要素から作成されます。2 つあり、1 つはオリジナルのセレクト ボックスを覆うカスタム セレクト ボックスのようなボタンです。2 番目の要素はオプション オーバーレイです。

選択 ID から生成されたこれらの 2 つの要素 ID。基本的に、ID#select-choice-customを持つ選択ボックスには 2 つの新しい要素#select-choice-custom-menuと#select-choice-custom-button. それらは同じ名前ですが、両方とも名前に新しい接尾辞が追加されています:-menuと-button.

次のステップは、これらの要素に新しいフォント タイプを強制することです。これは、次の CSS で実行できます。

#select-choice-custom-menu li div div a, #select-choice-custom-button .ui-btn-inner .ui-btn-text span {
    font-family: Calibri,Arial !important;
}

これは単なる例です。代わりにフォントを使用してくださいCalibri。

于 2013-07-02T10:17:33.340 に答える