单击时，从另一个 div 添加/删除类答案

【问题标题】：On click, add/remove class from another div单击时，从另一个 div 添加/删除类
【发布时间】：2015-05-10 00:01:54
【问题描述】：

我希望在按下链接时从另一个 div 中添加/删除一个类。我搜索了几个答案并在线搜索，但找不到适合我的答案。

这是我的代码：

<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 时将active 类添加到#primary-menu。

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

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

【问题讨论】：

那么 jquery/js 的代码在哪里？
@u_mulder 我没有包含页面中的所有代码，但是是的，我确实确保包含 jQuery 库。
@Connor ：尽管您有权选择您认为正确的任何答案，但最好优先考虑那些最先回答并且它们也是正确的答案。 Alexandander 的回答和我的回答与选择的回答一样好，但是如果它们对您不起作用，可能是因为 .on() 方法需要 jQuery v1.7+，而您可能使用的是旧版本。仅作记录。
我很抱歉@JFK。我点击了一个随机通知，因此可能随机化了响应的顺序。我还没有支持几个 cmets 的“声誉”。我很抱歉。

标签： javascript jquery onclick

【解决方案1】：

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 -->

【讨论】：

【解决方案2】：

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

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

【讨论】：

【解决方案3】：

我不确定我是否理解您的问题，但我认为您问的是与此类似的问题。查看以下链接，您可以通过 Document.getElementsByClassName('Class name') 获取类名。

Remove class from elements in pure Javascript?

【讨论】：

【解决方案4】：

你可以的

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

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

【讨论】：