Tell me, I encountered the following problem, there is such a thing on HTML:

$('.check_group').click(function () { var check = $(this).children('input')[0]; check.checked = !check.checked; alert(check.checked); //Дальше собираюсь убирать/показывать все чекбоксы в соседних div }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div class="check_group" style="background-color: rgb(200, 138, 59);"> <input type="checkbox" /> - Выбрать все </div>

So, when you click on the checkbox, the state of the checkbox changes, and then jQuery is triggered and the state changes back.

How to make it so that when you click on the div / checkbox - the checkbox changes and there is an alert that something happened.

    2 answers 2

    Firstly, why exactly? You can also add a label and stylize it as needed. Secondly - the story handler at check_group input[type=checkbox] and cancel the forwarding of the event above DOM. EMNIP, prevendDefault

    • It is desirable that the change occurred exactly by div. And with "prevendDefault" - it is not entirely clear, I would very much like an example) - Pavel
    • $('check_group input[type=checkbox]').click(function(e) { e.preventDefault(); }); - something like this. And the documentation should not be problematic to google :-) - Alexander Pozharskii
    • Neither by clicking nor by mousedown is it blocked = (I corrected the code in the question - is it active now. If there is a free minute, is a working example possible?) - Pavel

    Found a temporary solution to the problem:

     $('.check_group').click(function (e) { var check = $(this).children('input')[0]; if (e.target.tagName == "INPUT") { check.checked = !check.checked; } check.checked = !check.checked; alert(check.checked); //Дальше собираюсь убирать/показывать все чекбоксы в соседних div }); 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div class="check_group" style="background-color: rgb(200, 138, 59);"> <input type="checkbox" /> - Выбрать все </div>

    But I will be very happy to see other examples without using "target" (I know that in this case it can be made more "human", but it does not suit me yet)