確定li內的“ a”元素是否具有帶有jquery的CSS類

Question

我想做一個不同li元素和li元素的子菜單類中的元素上的一些動作。 如果元素有2個類的current submenu ，當$（“。menu”）。mouseenter事件發生時，我想執行一些操作。 如果li元素不具有此功能，請執行其他操作。

    <nav id="id"> 
    <ul>
        <li><a href="index.html">index</a></li>
        <li><a href="serviceios.html" class="current submenu">Services</a></li>
        <li><a href="clients.html" >Clients</a></li>
        <li><a href="portfolio.html">Portfolio</a></li>
        <li><a href="contact.html" >Contact</a></li>
        <ul class="menu">
            <li><a href="#" class="documents" data-icon="&#xe000">1</a></li>

            <li><a href="#" class="messages" data-icon="&#xe001">2</a></li>

            <li><a href="#" class="signout" data-icon="&#xe002">3</a></li>
        </ul>
    </ul>
</nav>

我有：

$(".menu").mouseenter(
    function() {
        $(".menu").toggleClass('hover');
        $(".submenu").css("-webkit-border-radius", "8px 8px 0 0");
        $(".submenu").css("-moz-border-radius", "8px 8px 0 0");
        $(".submenu").css("border-radius", "8px 8px 0 0");
        if( $('li').hasClass('current submenu') )
            /*...*/
        else
            $(".submenu").toggleClass('current');
    }
);

該怎么辦？

Answer 1

這個jQuery對象：

$("li a.current.submenu")

將選擇所有帶有這些類的標簽，並且僅選擇那些標簽。 您可以使用該jQuery對象將任何操作限制為僅這些標簽。

或者，如果要遍歷li a.submenu所有項目，如果當前類在那里，則做一件事，否則進行另一件事，則可以這樣做：

$("li a.submenu").each(function() {
    if ($(this).hasClass("current")) {
        // do something here when current class is present
    } else {
        // do something here when current class is not present
    }
});

Answer 2

您正在將class設置為li內的a元素，因此a將具有該類。

用這個。 這將在li內部選擇a class submenu current 。

if( $('li a.submenu').hasClass('current') ) {
    console.log("Got an li");
    /* Do stuff here */
} else {
    $(".submenu").toggleClass('current');
}

如果您確定一次submenu類中只有一個元素，那么您也可以執行以下操作：

if( $('.submenu').hasClass('current') ) {

現場演示