2

li 要素内の要素とli 要素のサブメニュー クラスに応じていくつかのアクションを実行したいと考えています。要素に 2 つのクラスがある場合、 $(".menu").mouseenterイベントが発生したときに何らかのアクションを実行したいと考えています。li要素にこれがない場合は、何か他のことをしてください....current submenu

    <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');
    }
);

何をすべきか?

4

2 に答える 2

3

この jQuery オブジェクト:

$("li a.current.submenu")

これらのクラスの両方を持つすべてのタグと、それらのタグのみを選択します。その jQuery オブジェクトを使用して、操作をそれらのタグのみに限定できます。

または、すべてのli a.submenuアイテムを反復処理し、現在のクラスが存在する場合は 1 つのことを実行し、存在しない場合は別のことを実行する場合は、次のようにします。

$("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
    }
});
于 2013-01-26T05:28:16.703 に答える
2

内の要素に設定classしているので、クラスがあります。alia

これを使って。これにより、内のawith クラスが選択されます。submenu currentli

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

一度にクラスを持つ要素が 1 つしかないことが確実な場合はsubmenu、次のこともできます。

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

ライブデモ

于 2013-01-26T05:38:33.490 に答える