4

これは非常にわかりにくく、少し恥ずかしいかもしれませんが、CSSを使用してチェックボックスを「チェック」する方法を理解するのに苦労していますか?

setupたとえば、親がクラスを持っている場合、すべてのチェックボックスをsetup親としてチェックする必要があります。これは純粋なCSSでは実行できないと思いますよね?JSを使用してもかまいませんが、チェックボックスの状態を親の状態と一緒に切り替えることができるかどうか(クラスを切り替えることによって)非常に興味があります。

これがいじくり回すフィドルです。

4

2 に答える 2

3

「チェック」されているチェックボックスはスタイルではありません。状態です。CSSは状態を制御できません。チェックマークやリストなどの背景画像を使用して何かを偽造することはできますが、それは実際にはあなたが話していることではありません。

チェックボックスの状態を変更する唯一の方法は、HTMLまたはJavascriptでサーバーサイドを使用することです。

編集

これがそのpseduoコードのフィドルです。物事は、それはかなり無意味です。

これは、jQueryで「チェック」するサーバー上の要素にCSSクラスを追加する必要があることを意味します。その場合は、実際に要素属性を追加することをお勧めします。

http://jsfiddle.net/HnEgT/

だから、私はあなたが話していることを理解しているだけなのかどうか疑問に思います。クライアント側のスクリプトが状態を変更していると思い始めていますが、それを監視しようとしていますか?

編集2

コメントの反映と簡単な掘り下げの際に、属性値を変更する可能性のある他のJavaScriptプラグイン(イベントトリガーを持たないもの)がある場合にチェックボックスをチェックするJavaScriptソリューションが必要な場合、唯一のソリューションは特定のクラスの要素のグループを継続的にチェックして更新する単純な「タイムアウト」ループを実行することです。

次に行う必要があるのは、このタイムアウトを発生させる頻度を設定することだけです。ある意味では、これは「長いポーリング」の一形態ですが、実際にはデータ更新のためにサーバーに出向くことはありません。それはすべてクライアント側です。これが「タイムアウト」と呼ばれるものだと思います。= P

これが私がこのテーマで見つけたチュートリアルです:

http://darcyclarke.me/development/detect-attribute-changes-with-jquery/

jQueryサンプルを作成できるかどうかを確認します。

アップデート

これは、チェックボックスに追加されているCSSクラスをチェックし、それらの状態を「チェック済み」に設定するためのタイムアウトリスナーのjsfiddleです。

http://jsfiddle.net/HnEgT/5/

「チェックされた」クラスをチェックボックスに数秒ごとにランダムに追加する2番目の関数を追加しました。

お役に立てば幸いです。

于 2012-08-18T00:33:09.197 に答える
0

純粋なCSSでは不可能です。

ただし、クラスのすべての要素にアタッチされるjQueryイベントを設定して、クラスの割り当てに基づいてチェックまたはチェック解除をトリガーすることができます。

おそらくこのように:

function toggleCheck(className){
 $("."+className).each( function() {
  $(this).toggleClass("checkedOn");
 });
 $(".checkedOn").each( function() {
  $(this).checked = "checked";
 });
}
于 2012-08-18T00:33:44.400 に答える