jQueryで現在の要素の背景を変更する

Question

<label class="default" for="checkbox1"><input id="checkbox1" name="checkbox1" type="checkbox" style="display:none" /> some text</label><br /> 
<label class="default" for="checkbox2"><input id="checkbox2" name="checkbox2" type="checkbox" style="display:none" /> some text</label><br /> 
<label class="default" for="checkbox3"><input id="checkbox3" name="checkbox3" type="checkbox" style="display:none" /> some text</label><br /> 

jQueryを使用して、現在クリックされているチェックボックスのラベルの背景色を変更する方法を教えてください。第二チェックボックスがチェックされている場合たとえば、それのスタイルを変更しなければならない「にチェック」で：

<label class="checked" for="checkbox2"><input id="checkbox2" name="checkbox2" type="checkbox" style="display:none" /> some text</label><br /> 

Answer 1

のjQueryのチェックボックスの選択は非常に親「ラベル」要素を取得し、「確認」するCSSクラスを切り替えるにはクリック機能を割り当てることを使用して、あります。これにより、クラスが追加され、チェックボックスの状態に応じてクラスが削除されます。代わりに、あなたは上記のやったことの

<label class="checked" for="checkbox2"><input id="checkbox2" name="checkbox2" type="checkbox" style="display:none" /> some text</label><br /> 

を：あなたがしなければ

$("input:checkbox").click(function() { $(this).parent("label").toggleClass("checked"); 

また、あなたはあなたのCSSクラス名を持つより多くの運を持っています。 ;）

Answer 2

をあなたはchangeイベントを処理し、this.checkedかどうかを確認した後、背景色を設定する必要があります。たとえば
：

$(':checkbox').change(function() { 
    $(this).css('background-color', this.checked ? 'red' : 'transparent'); 
}); 

Answer 3

$("input[@type='checkbox']").click(function(){ 
    $(this).toggleClass('checked'); 

}); 

Answer 4

あなたのHTMLは、より次のようになります。

jQueryのは次のようになります。私はこれは愚かな質問であると確信して

$("input[type=checkbox]").select(function() { 
    $(this).toggleClass("checked"); 
});