logo标签列表

通过查找删除一个类名

jqueryhtmlcss
3
我有一个基于Bootstrap构建的菜单，并且已经编写了一个用jQuery创建下拉菜单的代码；以下是HTML和jQuery部分：
<nav id="main-nav" class="collapse navbar-collapse pull-right" role="navigation">
            <ul id="menu-menu-1" class="nav navbar-nav">
                <li class="active menu-home"><a href="index.html">Home</a>
                </li>
                <li class="dropdown menu-sectors"><a class="dropdown-toggle" href="sectors.html">Sectors</a>
                    <ul class="dropdown-menu">
                        <li class="menu-domestic"><a href="sectors/domestic/index.html">Domestic</a>
                        </li>
                        <li class="menu-industrial"><a href="sectors/industrial/index.html">Industrial</a>
                        </li>
                        <li class="menu-commercial"><a href="sectors/commercial/index.html">Commercial</a>
                        </li>
                        <li class="menu-public-sector"><a href="sectors/public-sector/index.html">Public Sector</a>
                        </li>
                     </ul>
                      </li><li class="dropdown menu-facilities"><a class="dropdown-toggle" href="facilities.html">Facilities</a>
                    <ul class="dropdown-menu">
                        <li class="menu-energy-anlysis"><a href="facilities/energy-anlysis/index.html">Energy Analysis &amp; Reporting</a>
                        </li>
                        <li class="menu-billing-analysis"><a href="facilities/billing-analysis/index.html">Billing Analysis &amp; Procurement</a>
                        </li>
                        <li class="menu-Site-design"><a href="facilities/site-design/index.html">Site Analysis &amp; System Design</a>
                        </li>
                        <li class="menu-software-backup"><a href="facilities/software-backup/index.html">Software &amp; Systems Backup</a>
                        </li>
                        <li class="menu-hardware-controls"><a href="facilities/hardware-controls/index.html">Hardware &amp; Controls</a>
                        </li>
                        <li class="menu-thermography"><a href="facilities/thermography/index.html">Thermography</a>
                        </li>
                        <li class="menu-pat-testing"><a href="facilities/pattesting/index.html">PAT Testing</a>
                        </li>
                    </ul>
                </li><li class="dropdown menu-technologies"><a class="dropdown-toggle" href="technologies/index.html">Technologies</a>
                    <ul class="dropdown-menu">
                        <li class="menu-software-backup"><a href="facilities/software-backup/index.html">Software &amp; Systems Backup</a>
                        </li>
                        <li class="menu-hardware-controls"><a href="facilities/hardware-controls/index.html">Hardware &amp; Controls</a>
                        </li>
                        <li class="menu-r-d"><a href="facilities/r-d/index.html">Research &amp; Development</a>
                        </li>
                    </ul>
                </li><li class="menu-news"><a href="news/index.html">News</a>
                </li>
                <li class="menu-about-us"><a href="about-us/index.html">About Us</a>
                </li>
                <li class="menu-contact-us"><a href="contact-us/index.html">Contact us</a>
                </li>
            </ul>
        </nav>

JQuery部分

    + function ($) {
    "use strict";
    $('.dropdown').on('mouseenter',function() {
        $(this).addClass('open');
        $(this).prev('li.dropdown').removeClass('open');        
        $(this).next('li.dropdown').removeClass('open');        
    });

    $('#menu-menu-1').on('mouseleave', function () {
                //remove the open class here 
       }); 

}(window.jQuery)

我希望在离开#menu-menu-1容器或悬停在其他项目上时删除open类，但目前我还没有找到方法。
这里是示例：http://jsfiddle.net/7eay9eo0/
1
$('.open').removeClass('open')? - Ben
1个回答
2

使用.removeClass()：

$('.open').removeClass('open')
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接