JQuery снимите и проверьте и наоборот флажком дочернего элемента

Question

Вот мой HTML

#This will be generated throught loop 

<li class="selector"> 
    <a> 
    <input type="checkbox" value="test" /> test 
    </a> 
</li> 

Вот мой JQuery нажмите событие

$('.selector').on('click', function() { 
    if($(this).find('input').is(':checked')){ 
    #uncheck the checkbox  
    }else{ 
    #check the checkbox 
    } 
}); 

Как снимите флажок, если проверить и проверить, если незарегистрированный

Answer 1

Попробуйте

$(document).on('click', '.selector', function (e) { 
    if (!$(e.target).is('input')) { 
     $(this).find('input').prop('checked', function() { 
      return !this.checked; 
     }); 
    } 
}); 

Демо: Fiddle

Другой способ

$(document).on('click', '.selector', function (e) { 
    $(this).find('input').prop('checked', function() { 
     return !this.checked; 
    }); 
}); 
$(document).on('click', '.selector input', function (e) { 
    e.stopPropagation(); 
}); 

Демо: Fiddle

Answer 2

Попробуйте

$('.selector').on('click', function() { 
     var checkbox = $(this).find(':checkbox'); 
     if($(checkbox).is(':checked')){ 
      $(checkbox).prop('checked', false);  
     }else{ 
     #check the checkbox 
      $(checkbox).prop('checked', true); 
     } 
    }); 

Answer 3

Я не понимаю, почему вы пытаетесь сделать это с помощью JavaScript. Если пользователь нажимает на этот флажок, он автоматически проверяет/снимает флажок, но если вы добавите код для проверки/снятия отметки с него в JS, который будет отменять поведение по умолчанию, поэтому в обработчике кликов вам нужно будет проверить, что клик был в другом месте в пределах .selector.

Anwyay, то .prop() method покрывали Вас:

$('.selector').on('click', function(e) { 
    if (e.target.type === "checkbox") return; // do nothing if checkbox clicked directly 
    $(this).find("input[type=checkbox]").prop("checked", function(i,v) { 
     return !v; // set to opposite of current value 
    }); 
}); 

Демо: http://jsfiddle.net/N4crP/1/

Однако, если ваша цель просто позволить нажав на текст «тест» нажать на поле вы не» т нужно JavaScript, потому что это то, что делает <label> элемент:

<li class="selector"> 
    <label> 
    <input type="checkbox" value="test" /> test 
    </label> 
</li> 

Как вы можете видеть в этой демонстрации: http://jsfiddle.net/N4crP/2/ - нажатие на текст «test» или флажок переключает текущее значение без какого-либо JavaScript.