悬停（或不是）时隐藏元素的jQuery目标父对象

Question

我正在尝试将一个类（或CSS）添加到a，这是隐藏ul的父级，它会在祖父li悬停时显示。
我无法直接更改代码以获得结果，因此我需要jQuery 代码如下：

HTML

<nav class="main-menu">
  <ul>
    <li>
      <a>
        <ul class="sub-menu">

CSS

.main-menu .sub-menu {display: none;}
.main-menu li:hover .sub-menu {display: block;}
.hovered {color: red;}

这就是我正在尝试使用jQuery，但它不起作用：

的jQuery

jQuery(".nm-main-menu ul.sub-menu).hover(function(){
  jQuery(this).parent().addClass("hovered");
});

这里全是fiddle 也许.hover()不是可行的方式...... 请帮忙。

Answer 1

jQuery(".nm-main-menu ul.sub-menu").hover(function(){
  jQuery(this).parent().addClass("hovered");
});

你错过了选择器内的双引号。它正在工作。

小提琴：https://jsfiddle.net/gyowv1dx/1/

Answer 2

你在jquery选择器的最后错过了双引号。你也可以通过使用$来访问jquery。 这是修改过的小提琴

Working Fiddle

$(".main-menu ul.sub-menu").hover(function(){ $(this).parent().addClass("hovered"); });

Answer 3

$(".nm-main-menu ul.sub-menu").hover(function(){
  $(this).parent().addClass("hovered");
});

使用$代替jQuery而错过双引号

Answer 4

不仅缺少双引号而且错误地将类名.nm-main-menu放在.main-menu上。确定您应该按console.log或alert进行测试

jQuery(".main-menu ul.sub-menu").hover(function(){
        console.log("Working"); //alert("Working");
        jQuery(this).parent().addClass("hovered");
});