jqueryを使用してIMG経由でチェックボックスを制御する

Question

ユーザーがページ内の ".latinAmerica"クラスの画像をクリックすると、チェックボックスのチェック状態を制御したい。各クリックは毎回それをチェックする/しないでください。

さまざまな方法を試しましたが、チェックボックスに適したものは見つかりませんでした。

EGは：

$('.latinAmerica').click(function() { 
    $('input:checkbox[name=theName]:nth(0)').attr('checked',true); 
}); 

しかし、チェックボックスと運：

$('.latinAmerica').click(function() { 
    if($('input:checkbox[name=theName]:nth(0)').is(':checked')) { 
     $('input:checkbox[name=theName]:nth(0)').attr('checked',true); 
    } else { 
     $('input:checkbox[name=theName]:nth(0)').attr('checked',false); 
    } 
}); 

または

$('.latinAmerica').click(function() { 
    $("input:checkbox[name=theName]:nth(0)").prop("checked", true); 
}); 

私はラジオボタンでの作業この方法を手に入れました。

何が間違っている:(午前

おかげ

Answer 1

$(function() { 
    $(".latinamerica").click(function() { 
     var cb = $("input[name='theName']"); 
     if(cb.is(":checked")) { 
      cb.prop("checked", ""); 
     } else { 
      cb.prop("checked", "checked"); 
     } 
    }); 
}); 

フィドル：http://jsfiddle.net/JFDxj/

Answer 2

ザ・条件は、それがすでにあるときにチェックされているcheckedboxつまり何もしてはいけないので、間違っている場合既にチェックが外されている場合にチェックし、チェックを外す。

$('.latinAmerica').click(function() { 
    if($('input:checkbox[name=theName]:nth(0)').is(':checked')) { 
     $('input:checkbox[name=theName]:nth(0)').attr('checked',false); 
    } else { 
     $('input:checkbox[name=theName]:nth(0)').attr('checked',true); 
    } 
});