0

jqueryで同じテーマを持つ3つのラジオボタンがあります。それらのいずれかを選択すると、ボタンの色が css の .ui-btn-active クラスで指定された色に変わります。私のラジオボタンの名前は、会える、わからない、辞退です。拒否ラジオ ボタンが選択されたときに、他の 2 つのラジオ ボタンとは異なる色 (赤色) を使用したいと考えています。

私はJqueryモバイルを使用しており、さまざまなテーマで使用したい色のcssをカスタマイズし、.ui-btn-activeを.ui-btn-active-aおよび.ui-btn-active-に変更しましたb 異なる値で作成しました。2 つの ui-btn-active クラスをうまく切り替えようとしましたが、うまくいかずに addClass(..) と removeClass(..) を試しました。jquery-mobile.js で次のようなメソッドを作成しました。

 $.mobile.changeAction = function( activeBtn){
    $.mobile.activeBtnClass = activeBtn;
}

ここで、activeBtn パラメーターは、必要な activeBtnClass を選択するための文字列になります。問題は、オーバーライド後に activeBtnClass を更新する際に問題があることだと思います。いくつかの更新方法を試してみましたが、うまくいきませんでした。

アクティブなときにラジオボタンの色が異なる限り、私は非常に感謝しています.

4

2 に答える 2

4

次のスタイルでうまくいくはずです： スクリーンショット1 縦積み

.ui-radio:nth-child(1) .ui-icon-radio-on.ui-icon{
    background-color:green;
}
.ui-radio:nth-child(2) .ui-icon-radio-on.ui-icon{
    background-color:grey;
}
.ui-radio:nth-child(3) .ui-icon-radio-on.ui-icon{
    background-color:red;
}​

サンプルjsfiddle。

横積みのスタイルを設定するには、次のオプションを選択します。

スクリーンショット2 横積み

.ui-radio:nth-child(1) .ui-radio-on span.ui-btn-inner{
    background-color:green;
}
.ui-radio:nth-child(2) .ui-radio-on span.ui-btn-inner{
    background-color:grey;
}
.ui-radio:nth-child(3) .ui-radio-on span.ui-btn-inner{
    background-color:red;
}​

サンプルjsfiddle。

于 2012-07-20T13:48:24.260 に答える
0

必要なすべての州のカスタム テーマを作成してみませんか? 複数のカスタム テーマを用意して、必要な場合にのみ使用できます。私は CSS に 7 つのテーマを持っています。このようにして、必要に応じて後でいつでも組み込むことができます。カスタム コーディングをそれほど行う必要はありません。

data-theme="f"（または他の文字見本）要素属性を使用してテーマを適用するだけです。

これはjQuery ThemeRoller 1.1.1 http://jquerymobile.com/themeroller/index.phpです。アクティブな状態など、テーマに小さな変更を加えるだけの場合は、テーマをコピーして変更を加え、新しいスウォッチとして保存します。あなたはAZから行くことができます:)

于 2012-07-20T19:15:23.230 に答える