K
K
kerptwotwo2021-06-07 15:48:43
JavaScript
kerptwotwo, 2021-06-07 15:48:43

Why doesn't js code work through this?

I need to hide "promocode-more", if there is no text in "promocode-more__text", the classes are repeated, so I need to refer to the specific "promocode-more", which does not work for me, I tried in different ways. Can you suggest what is wrong?

<div class="promocodes-text">
            <div>
                <p class="promocode-text__title">
                    <span>-150 рублей</span> на весь ассортимент
                    <br>по промокоду.
                </p>
                <p class="promocode-text__description">
                    Скидка
                    <span class="promocode-more">
                        ...
                    </span>
                    <!-- В promocode-more__text писать текст, который будет прятаться на мобильном -->
                    <span class="promocode-more__text">
                        Приобретите на сумму от 3500р. c приятной скидкой. 
                    </span>
                </p>
            </div>
        </div>

$(document).ready(function () {

        $(".promocode-text__description").ready(function () {
            var that = '';
            if ($(".promocode-text__description").children(".promocode-more__text").is(':empty')) {
                that = 1;
            } else {
                console.log('Не пустой');
            }
            if (that == 1) {
                console.log('Работает');
                $(this).children(".promocode-more").addClass("hides");
            }
        });

        $(".promocode-text__description").click(function () {
            if ($(window).width() < 575) {
                $(this).children(".promocode-more__text").toggleClass("expand");
                $(this).children(".promocode-more").toggleClass("hides");
            }
        });
    });

Answer the question

In order to leave comments, you need to log in

1 answer(s)
S
Sergey delphinpro, 2021-06-07
@kerptwotwo

$('.promocodes-text').each(function(){
  const $desc = $('.promocode-text__description', this);
  const $text = $('.promocode-more__text', this);
  const $more = $('.promocode-more', this);
  
  if ($text.is(':empty')) {
    $more.addClass("hides");
  }

  $desc.click(function () {
    if ($(window).width() < 575) {
      $text.toggleClass("expand");
      $more.toggleClass("hides");
    }
  });
});

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question