-1

jQuery UI 用に独自の CSS を作成しています。

基本的に、ラジオ ボタン、チェックボックス、および通常のボタンには異なるスタイルが必要です。

ここでの問題は、偽のウィジェットに追加される jQuery のクラスが、それがどのような種類のボタンであるかを指定しないことです。

たとえば、次のコードがあるとします。

<input type="checkbox" name="location[]" id="location1" value="Somewhere" />
<label for="location1">Somewhere</label>

<script type="text/javascript">
    $(document).ready(function(){
        jQuery('input').button();
    });
</script>

jQuery は、これら 2 つの要素を次のように変換します。

<input type="checkbox" name="location[]" id="location1" value="Somewhere"
  class="ui-helper-hidden-accessible">

<label for="location1" aria-pressed="false" role="button" aria-disabled="false"
  class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only">
    <span class="ui-button-text">Somewhere</span>
</label>

ご覧のとおり、変更されたラベルと生成されたスパンには、チェックボックス (またはラジオ/ボタン) であることを示すクラスがありません。

理想的な解決策は、私が気付かなかったいくつかのクラスに基づいていることを願っています。2 番目に良い解決策は、jQuery UI にモンキー パッチを適用して、これらの入力により良いクラスを追加することです。最終的に考えられる解決策は、jQuery ファイルをハックすることです...ただし、これは避けたいと思います。

いかなる種類のファンボーイ主義、非建設的なコメント、および同様の回答も容認されないことに注意してください. 問題は jQuery UI です。mootools や extjs など、トレンディな l33t ライブラリが頭に浮かんだら聞きたくありません。

4

2 に答える 2

2

入力にクラスを追加する$('input:checkbox').addClass('ui-checkbox')ために追加することができます。ui-checkbox

$('input:checkbox').each(function() {
  $('label[for="'+this.id.+'"]').addClass('ui-checkbox-label');
})

ui-checkbox-labelチェックボックスのすべてのラベルにクラスを追加するには

于 2012-01-23T11:31:17.603 に答える