jQuery не может выбрать элемент с hasClass ("open") или is (": visible)

Question

Я не могу выбрать элемент на основе hasClass (" open ") или is (": visible).

<ul class="menu"> 
    <li class="nav-item"> 
     <a href="about">About</a> 
     <div class="sub-nav-wrapper"> 
      <ul class="sub-menu"> 
       <li>...</li> 
      </ul> 
     </div> 
    <li>...</li> 
</ul> 

if ($('ul.menu li div').hasClass("open")) { 
    $(this).parent().children("a").css('background', '#666'); 
} 

При наведении на «О» ссылке, появится подменю ниже и класс добавляется в DIV с классом «суб-нав-обертки». Класс называется «открытым». Но когда пользователь перемещает курсор в область подменю, основное звено («О») теряет цвет наведения. Поэтому я пытаюсь вернуть его с помощью JS. Он не работает, и я также попробовал .is(":visible") и использовал предупреждение, чтобы проверить его, но предупреждение появлялось каждый раз, даже до того, как я что-то делал, только при загрузке страницы.

Answer 1

Есть несколько проблем здесь. Во-первых, такой оператор if будет выполнен только один раз, поэтому он не будет работать как слушатель. Во-вторых, .hasClass() просто возвращает логический элемент, а не элемент DOM, поэтому this в вашем заявлении if не так, как вы думаете.

Я бы справился с этим с помощью обработчика событий mouseover/mouseout. Попробуйте:

$('ul.menu li div').mouseover(function(e) { 
    $(this).parent().children("a").css('background', '#666'); 
}).mouseout(function(e) { 
    $(this).parent().children("a").css('background', '#original-bg-color'); 
}); 

Вам нужно будет заменить "#original-bg-color" с цветом фона по умолчанию для ваших навигационных ссылок. Надеюсь, это поможет!

Answer 2

Попытка добавить точку открыть ... -> hasClass ('открытый'.)

С уважением