0

Есть меню:

<div class="Nav__Megamenu -Fader">
<ul class="Nav__Sub Nav__Level--2">
  <li class="Nav__Item--Sub Nav__Item--Level-2  doubletap" data-next=".Nav__Block--0">
   <a class="Nav__Link--Sub Nav__Link--Level-2" href="/category/category_2275/">Смеси для пола</a>   </li>
<li class="Nav__Item--Sub Nav__Item--Level-2  doubletap" data-next=".Nav__Block--1">
  <a class="Nav__Link--Sub Nav__Link--Level-2" href="/category/category_2279/">Затирка</a>
</li>
<li class="Nav__Item--Sub Nav__Item--Level-2  doubletap" data-next=".Nav__Block--2">
<a class="Nav__Link--Sub Nav__Link--Level-2" href="/category/category_2276/">Плиточные клеи</a></li>
</ul>
<div class="Nav__Sub Nav__Level--3"></div>
</div>

Нужно проверить, если нету класса Nav__Level--3 то у .Nav__Megamenu сделать фон белым,

$(".Nav__Megamenu").map(function(){
    var check_level = $(this).find("Nav__Level--3");
        if(!check_level){
            $(this).css("background", "#fff");
    }
})

Вот так не получилось.. p.s делал map потому что Nav__Megamenu -Fader несколько на странице

2 ответа 2

2

Проверьте правильность использования метода find!!! Элемент ищется с указанием . или #. И переменная всегда будет истинной так как всегда возвращается объект! Просто так сделайте:

$(".Nav__Megamenu").map(function(){
    var check_level = $(this).find(".Nav__Level--3");
        if(!check_level.length){
            $(this).css("background", "red");
    }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="Nav__Megamenu -Fader">
<ul class="Nav__Sub Nav__Level--2">
  <li class="Nav__Item--Sub Nav__Item--Level-2  doubletap" data-next=".Nav__Block--0">
   <a class="Nav__Link--Sub Nav__Link--Level-2" href="/category/category_2275/">Смеси для пола</a>   </li>
<li class="Nav__Item--Sub Nav__Item--Level-2  doubletap" data-next=".Nav__Block--1">
  <a class="Nav__Link--Sub Nav__Link--Level-2" href="/category/category_2279/">Затирка</a>
</li>
<li class="Nav__Item--Sub Nav__Item--Level-2  doubletap" data-next=".Nav__Block--2">
<a class="Nav__Link--Sub Nav__Link--Level-2" href="/category/category_2276/">Плиточные клеи</a></li>
</ul>
<div class="Nav__Sub Nav__Level--3"></div>
</div>

<div class="Nav__Megamenu -Fader">
<ul class="Nav__Sub Nav__Level--2">
  <li class="Nav__Item--Sub Nav__Item--Level-2  doubletap" data-next=".Nav__Block--0">
   <a class="Nav__Link--Sub Nav__Link--Level-2" href="/category/category_2275/">Смеси для пола</a>   </li>
<li class="Nav__Item--Sub Nav__Item--Level-2  doubletap" data-next=".Nav__Block--1">
  <a class="Nav__Link--Sub Nav__Link--Level-2" href="/category/category_2279/">Затирка</a>
</li>
<li class="Nav__Item--Sub Nav__Item--Level-2  doubletap" data-next=".Nav__Block--2">
<a class="Nav__Link--Sub Nav__Link--Level-2" href="/category/category_2276/">Плиточные клеи</a></li>
</ul>
<div class="Nav__Sub Nav__Level--4"></div>
</div>

<div class="Nav__Megamenu -Fader">
<ul class="Nav__Sub Nav__Level--2">
  <li class="Nav__Item--Sub Nav__Item--Level-2  doubletap" data-next=".Nav__Block--0">
   <a class="Nav__Link--Sub Nav__Link--Level-2" href="/category/category_2275/">Смеси для пола</a>   </li>
<li class="Nav__Item--Sub Nav__Item--Level-2  doubletap" data-next=".Nav__Block--1">
  <a class="Nav__Link--Sub Nav__Link--Level-2" href="/category/category_2279/">Затирка</a>
</li>
<li class="Nav__Item--Sub Nav__Item--Level-2  doubletap" data-next=".Nav__Block--2">
<a class="Nav__Link--Sub Nav__Link--Level-2" href="/category/category_2276/">Плиточные клеи</a></li>
</ul>
<div class="Nav__Sub Nav__Level--4"></div>
</div>

1
const item = document.querySelector(".div");

if (item.classList.contains('someClass')) {
    // if true
}

Я написал сам принцип, вот для вашего случая

var cond = $(".Nav__Megamenu").hasClass("Nav__Level--3");
if (!cond) {
   $(".Nav__Megamenu").css("background", "#fff");
}
4
  • $(".Nav__Megamenu").map(function(){ const item = document.querySelector(".Nav__Megamenu"); if (item.classList.contains('Nav__Level--3')) { $(this).css("background", "#fff"); } }) Вот так тоже не срабатывает
    – ilyaaa521
    Commented 1 сент. 2020 в 10:32
  • @ilyaaa521, $(".Nav__Megamenu").map(function() { if (this.classList.contains('Nav__Level--3')) { $(this).css("background", "#fff"); } });
    – Deonis
    Commented 1 сент. 2020 в 10:40
  • Исправил под ваш случай Commented 1 сент. 2020 в 10:43
  • Оно работает но срабатывает сразу для всех Nav__Megamenu, то-есть нужно что то типо $(this).css("background", "#fff");
    – ilyaaa521
    Commented 1 сент. 2020 в 10:51

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.