Как показать блок по событию?

Question

[zuraavl]

Есть два слайдера, они делят по 50% ширину окна и показывают одну картинку за раз. В каждом слайдере скажем, разные детали конструктора и когда пользователь наклацал нужное сочетание, должен появится блок, который его с этим поздравит.

Пытаюсь делать вот так:

$(".item").click(function () {
     if ($('.slick-current').hasClass('best_011', 'best_012')) {
            $('.test-box').css('display', 'block');
      }
});

.slider-text-left
        .item
          h3 Один
        .item
          h3 Два
        .item.best_011
          h3 Сочетание
.slider-text-right
        .item
          h3 Один
        .item.best_012
          h3 Два
        .item
          h3 Сочетание

Не работает

Update
Получилось вот так:

$("html").click(function () {

    if ($('.best_011').hasClass('slick-current') && $('.best_012').hasClass('slick-current')) {
      $(".test-box").show();
    }
    else {
      $(".test-box").hide();
    }
    
  });

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

Answer 1

[Данил Сысоев]

Так тебе нужен дочерний элемент. Проверяй .item а не .slick-current.

Comments

[zuraavl]

Мне кажется я делаю что-то не так, но до конца не понимаю. Как он выполнит условие, если клики на эти элементы происходят в разное время?

[Данил Сысоев]

Так у тебя функция вызывается по клику. Каждый раз когда ты кликаешь - он проверяет условие, а если if(true) тогда он выдаст тебе твое сообщение.

[Данил Сысоев]

www.allineed.ru/ru/jquery-articles/api-feautures/8... - вот еще. У hasClass не может быть два атрибута.

Answer 2

[Sergey Vydayko]

$(document).ready(function(){
$(document).on('click', '1', function(){
$('2').toggleClass('3');
});
});
1 - класс на который кликаешь,
2- класс к которому нужно добавить новый класс к примеру active,
3 - сам класс который хочешь добавить