Hello guys.

Task: check the selection of the option in the mini-product, if the option is not selected, displays the message "Select option".

HTML:

<div class="wrapper"> <div class="item"> <div class="item__variant"> <div class="item__variant-1"></div> <div class="item__variant-2"></div> <div class="item__variant-3"></div> </div> <button class="item__add-to-cart">Купить</div> </div> <div class="item"> <div class="item__variant"> <div class="item__variant-1"></div> <div class="item__variant-2"></div> <div class="item__variant-3"></div> </div> <button class="item__add-to-cart">Купить</div> </div> </div>

jQuery:

 $('.item__add-to-cart').on('click', function() { var $this = $(this).siblings('.item__variant'); if(!$($this).find('active')) { alert("Выберите вариант"); } });

jQuery does not work ...

    1 answer 1

    you probably wanted to find an element whose class is set to active , but in the code you search for the element <active> . To specify a class in the jquery selector, use .active .

     var $this = $(this).siblings('.item__variant'); if(!$this.find('.active')) { alert("Выберите вариант"); }

    I also note the extra wrapper $($this) , simple enough $this , because it is already a variable jquery.

    • and generally to produce variables, if you use it once, it is not necessary - if(!$(this).siblings('.item__variant').find('.active')) is enough if(!$(this).siblings('.item__variant').find('.active')) - Artem Gorlachev
    • @ArtemGorlachev there is nothing bad in the variable as a whole, its visibility / life zone is limited. It is possible without them, but this is an amateur, long expressions are also not always convenient. However, the use of the variable name $this generally doubtful, since it can potentially lead to confusion and errors when this $this confused with the simple this - teran