Как удалить класс с JS, если элемента нет? - PullRequest
0 голосов
/ 03 мая 2018

На моем сайте у меня есть меню справа от панели навигации. Отображает результаты поиска, когда они доступны на текущей странице.

Я хочу отобразить значок, когда поиск доступен.

Все поисковые блоки имеют класс .views-exposed-form и отображаются в #navbar-collapse-second

Я добавил к своей иконке класс .icon-navbar-alert-disable, который используется, чтобы скрыть иконку.

Как удалить класс .icon-navbar-alert-disable, если класс .views-exposed-form присутствует в #navbar-collapse-second?

Вот код CSS, чтобы скрыть значок:

.region-navigation-menu-second .navbar-toggle-second .icon-navbar-alert-disable {
    display: none;
}

Вот код кнопки моего ману со значком:

<div{{ attributes }}>

<a class="navbar-toggle-second collapsed" data-toggle="collapse" data-target="#navbar-collapse-second" aria-expanded="false">

  <div class="icon-navbar">
    <span class="fa-layers fa-3x">
      <i class="far fa-circle"></i>
      <span class="navbar-icon-open">
        <i class="fas fa-filter" data-fa-transform="shrink-9"></i>
      </span>
      <span class="navbar-icon-close">
        <i class="fas fa-times" data-fa-transform="shrink-8"></i>
      </span>
    </span>
  </div>

  <div class="icon-navbar-alert icon-navbar-alert-disable">
    <span class="fa-stack fa-lg">
      <i class="fas fa-circle fa-stack-2x"></i>
      <i class="fas fa-filter fa-stack-1x fa-inverse"></i>
    </span>
  </div>

</a>

</div>

Вот соответствующая страница, это меню справа:

https://www.s1biose.com/boutique/ma-boutique-pro

Я запустил код JS, но он не завершен:

  $('#navbar-collapse-second') ???.views-exposed-form??? {
       $('#block-togglenavigationsecond').removeClass('icon-navbar-alert-disable');
  });

UPDATE

(function ($) {

  if ($('#navbar-collapse-second').hasClass('views-exposed-form')) {
       $('#block-togglenavigationsecond').removeClass('icon-navbar-alert-disable');
  } else { 
       $('#block-togglenavigationsecond').addClass('icon-navbar-alert-disable');
  };

})(window.jQuery);

введите описание изображения здесь

1 Ответ

0 голосов
/ 03 мая 2018

Вы ищете селектор hasClass в jQuery?

Если это так, оберните его в оператор if, и внутри вы сможете показать желаемый результат;

if ($('#navbar-collapse-second').hasClass('views-exposed-form') === false) {
    $('#block-togglenavigationsecond').removeClass('icon-navbar-alert-disable');
} else { 
    $('#block-togglenavigationsecond').addClass('icon-navbar-alert-disable');
};
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...