Question

尝试将变量与：混合：然后将该变量与addClass一起使用。但是没有运气。

HTML

<ul>
  <li><a href="#">Nav One</a></li>
  <li><a href="#">Nav Two</a></li>
  <li><a href="#">Nav Three</a></li>
  <li><a href="#">Nav Four</a></li>
</ul>

LESS

ul{
    li{
        a{
            color: black;
            transition: all 0.5s ease;
            font-size: 3rem;
            text-decoration: none;
        }
    }
}
.enc-non-active{
    color: gray;
}

JAVASCRIPT

myFunction('ul li a', 'enc-active', 'enc-non-active');

function myFunction($menu, $activeClass, $nonActiveClass) {
   $(function(){
        $($menu).hover(function(){
            $(this).addClass($activeClass);
        },
        function(){
            $(this).removeClass($activeClass);
        });
        $($menu).hover(function(){
            var fullPath = $menu + ':not(' + $activeClass + ')';
            $(fullPath).addClass($nonActiveClass);
        },
        function(){
            var fullPath = $menu + ':not(' + $activeClass + ')';
            $(fullPath).removeClass($nonActiveClass);
        });
    });
}

以下是CodePen http://codepen.io/antfuentes87/pen/pJEaeb，如果有人能让我知道我做错了什么，那就太好了。谢谢你的时间。

Answer 1

你忘记了一个点：不是（。 - 很容易修复http://codepen.io/anon/pen/zGKRyW

var fullPath = $menu + ':not(.' + $activeClass + ')';
$(fullPath).addClass($nonActiveClass);

Answer 2

您缺少一个点以将类名称变为css选择器

更改

var fullPath = $menu + ':not(' + $activeClass + ')';

要

var fullPath = $menu + ':not(.' + $activeClass + ')';

的 DEMO

使用带有jQuery的变量addClass

2 个答案: