Клик по родителю,вызывает клик по дочернему элементу?

Question

[viktorulyushev]

Написал скрипт,который при клике по элементу добавляет класс,благодаря этому классу невидимый блок становится видимым,проблема в том что при нажатии на этот ранее скрытый блок,клик так же срабатывает,как сделать так чтобы клик срабатывал только по родителю?

$(document).ready(function(){
   $(" .toolbar-top-link-alt-zakaz").click(function () {
      if ($(".toolbar-top-link-alt-zakaz .CheckOrderBlock-custom").hasClass("open-order")) {
             $(" .toolbar-top-link-alt-zakaz .CheckOrderBlock-custom").removeClass("open-order");
             } else {
               $(".toolbar-top-link-alt-zakaz .CheckOrderBlock-custom").addClass("open-order");
           }
      });
});

Answer 1

[V Sh.]

Полезная информация: learn.javascript.ru (event bubbling)

Comments

[viktorulyushev]

Спасибо помогло

Answer 2

[myaca]

конкретно в этой ситуации, нет смысла в этой проверке...
Есть такой метод в jQuery:
toggleClass() - почитай про него
Для того, чтобы event не распространялся дальше по DOM, тебе нужно в колбек прокинуть объект event и сказать ему, мол, не надо дальше (stopPropagation())

Почитай про это по ссылке, что тебе скинули на learn.javascript.ru

$(" .toolbar-top-link-alt-zakaz").click(function (e) {
e.stopPropagation();
$(" .toolbar-top-link-alt-zakaz .CheckOrderBlock-custom").toggleClass("open-order");
});

Comments

[viktorulyushev]

ага,добавил onclick="event.stopPropagation()" для блока

[myaca]

viktorulyushev, в колбек прокинул ивент?
и еще, тебе бы с наименованием классов что-нибудь придумать надо бы. Нехорошо, когда они ну такие долгие, тут я уверен, что можно сократить спокойно...
1) принято использовать английские слова
2) CSS все равно на верблюжьюНотацию, поэтому используют либо дефис, либо подчеркивание
3) Попробуй прочитать и посмотреть на реальном примере про BEM-нейминг от Яндекс, сейчас очень-очень популярен именно такой вариант. Он просто и очень удобный.