单击时，add/remove class 来自另一个 div

Question

当按下 link 时，我正在从另一个 div 寻找 add/remove 一个 class。我搜索了几个答案并在线搜索，但找不到适合我的答案。

这是我的代码：

<nav id="primary-menu"> <a class="menu-toggle">Browse</a>
    <ul>
        <li><a href="#">Home</a></li>
        <li><a href="#">News</a></li>
        <li><a href="#">Rumors</a></li>
        <li><a href="#">Tutorials</a></li>
        <li><a href="#">Miscellaneous</a></li>
    </ul>
</nav> <!-- end #primary-menu -->

我希望在单击 .menu-toggle 时将 class active 添加到 #primary-menu。

对于JS/jQuery，我试过click、toggle、toggleClass，我试过内联代码，我试过外部脚本。似乎没有任何效果，我不确定为什么。

非常感谢您的回复。 PS：我不是最擅长 JS/jQuery。

Answer 1

你可以

$(".menu-toggle").on("click", function(){
    $(this).parent("#primary-menu").toggleClass("active");
});

注意：.on() 需要 jQuery v1.7+

Answer 2

http://jsfiddle.net/te7brkmj/
'click' 和 'toggleClass' 的组合对我有用。

$('.menu-toggle').click( function() {
    $("#primary-menu").toggleClass("someClass");
} );

试试这个：

$('.menu-toggle').click( function() {
    $("#primary-menu").toggleClass("someClass");
} );

.someClass{
    color: red;    
}

   

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<nav id="primary-menu">

<a class="menu-toggle">Browse</a>

    <ul>

        <li><a href="#">Home</a></li>
        <li><a href="#">News</a></li>
        <li><a href="#">Rumors</a></li>
        <li><a href="#">Tutorials</a></li>
        <li><a href="#">Miscellaneous</a></li>

    </ul>

</nav> <!-- end #primary-menu -->

Answer 3

首先确保您已加载 jQuery。然后尝试这样的事情：

 $( document ).ready(function() {
        $( "li" ).click(function() {
            $( "#primary-menu" ).toggleClass( "active" );
        });
    });

Answer 4

我不确定我是否理解你的问题，但我认为你在问类似的问题..查看下面的link，你可以通过Document.getElementsByClassName( 'Class name').

Remove class from elements in pure Javascript?

单击时，add/remove class 来自另一个 div

On click, add/remove class from another div

javascript

jquery

onclick