0

私は要素を持つJQMページを持っていますselect:

<select>
    ...
</select>

私はcssでそのオプションを大文字にしようとしました:

select{
    text-transform: capitalize;
}

私もCSSに追加しました：

select option{
    text-transform: capitalize;
}

大文字化は、Firefox や Chrome などのデスクトップ Web ブラウザーでは機能しますが、Dolphin などのモバイル Web ブラウザーや Android WebView では機能しません。モバイル Web ブラウザーで動作させるにはどうすればよいですか?

4

1 に答える 1

1

オプション要素を表示するためにネイティブ Android ディスプレイを使用している従来の select 要素について話しているのですか? そうする場合、大文字にすることはできません。オプションテキストを使用して、Android ネイティブの選択ルックで表示しています。CSS フォーマットは使用されません。

カスタムjQm select要素について話している場合、これで修正されます：http://jsfiddle.net/Gajotres/p3SHm/

CSS:

fieldset .ui-controlgroup-controls .ui-checkbox label span span.ui-btn-text {
    text-transform: capitalize;
}

.ui-select div span span.ui-btn-text span {
    text-transform: capitalize;
}

select option{
    text-transform: capitalize;
}

編集：

できることは、javascript を使用してすべての単語を大文字にし、それを pagebeforeshow イベント (またはページが表示される前にテキストが変更される他のイベント) で使用することです。上の私の例を見て、その方法を確認してください。

$('option').each(function(){
    $(this).html($(this).html().replace(/\w+/g, function(w){return w[0].toUpperCase() + w.slice(1).toLowerCase();}));
});
于 2012-12-14T10:36:32.693 に答える