2

私はコードhtmlを持っています

<div class="mobile"></div>
    <ul id="nav">
        <li><a href="index.php">Home</a></li>
        <li><a href="about.php">About</a></li>
        <li><a href="work.php">Work</a></li>
        <li><a href="contact.php">Contact</a></li>
    </ul>
</div>

私がする必要があります：クリックすると、ulにクラスを追加します

<div class="mobile"></div>
    <ul id="nav" class="visible">
        <li><a href="index.php">Home</a></li>
        <li><a href="about.php">About</a></li>
        <li><a href="work.php">Work</a></li>
        <li><a href="contact.php">Contact</a></li>
    </ul>
</div>

私はもう試した：

jQuery(document).ready(function() {
    jQuery('.mobile').click(function(){
        jQuery('#nav').removeClass('selected')
        jQuery('#nav').addClass('selected');
    });
});

初めてjsをクリックすると、必要に応じて選択したクラスが追加されます。しかし、もう一度クリックしても何も起こらず、そのクラスを削除する必要がありますが、機能しません。これどうやってするの？

誰もこれに対する答えを知っていますか？

4

3 に答える 3

1

使用toggleClass():

jQuery(document).ready(function() {
    jQuery('.mobile').click(function(){
         jQuery('#nav').toggleClass('selected');
    });
});

私には明確ではありませんが、visibleクラスまたはselectedクラスが必要です。

于 2013-01-30T11:41:28.200 に答える
1

コードで行うことは、クリックするたびにクラスを削除および追加することです。したがって、最初のクリック後も追加されたままになります。これを行うと、目的の動作を得ることができます。

$(document).ready(function() {
    $('.mobile').click(function(){
        $('#nav').toggleClass('selected');
    });
});
于 2013-01-30T11:41:37.470 に答える