Исключить флажок из .click() div

Question

Я пытаюсь сделать div активным, щелкнув по нему с помощью jquery. Но внутри div есть флажок. Я хочу, чтобы div стал активным, когда я нажимаю anywher внутри div, кроме флажка. Я сделал это, но флажок теперь не отвечает на события кликов (т. Е. Он не проверяется/не проверяется, когда я нажимаю на него).

http://jsfiddle.net/U7VmV/3/

$(document).ready(function(){ 
    $('.c-video').click(function(){ 
     $('.c-video').removeClass('active'); 
     $(this).addClass('active'); 
    }); 
}).children().find('label').click(function(e){ 
    return false; 
}); 

Answer 1

Использование event.stoppropagation()

Предотвращает событие от бурлит дерева DOM, предотвращая любые родительские обработчики из уведомления о событии.

}).find('label').click(function (e) { 
    e.stopPropagation(); 
}); 

Fiddle Demo

Answer 2

Вы должны предотвратить распространение события, когда вы return false он предотвращает распространение событий, но он также будет предотвращает действие по умолчанию события мыши, что проверка/сняв флажок.

Таким образом, вместо или возвращать ложный вызов stopPropagation() в объекте события

$(document).ready(function(){ 
    $('.c-video').click(function(){ 
     $('.c-video').removeClass('active'); 
     $(this).addClass('active'); 
    }); 
}).children().find('label').click(function(e){ 
    e.stopPropagation() 
}); 

Демо: Fiddle

Answer 3

Другой способ сделать это, чтобы проверить щелкнул целевое событие:

var $cVideo = $('.c-video').on('click', function(e) { 
    if (e.target.tagName != 'INPUT' && e.target.tagName != 'LABEL') { 
     $cVideo.removeClass('active'); 
     $(this).addClass('active'); 
    } 
}); 

http://jsfiddle.net/U7VmV/4/