0

これは、トグルでulを開くために使用するjquery関数ですが、クリックするとその中のリンクはページに移動せず、ulコンテナーを閉じます

jQuery('#app-main-4059').addClass('open');
jQuery('#app-main-4059').click(function() {
    if (jQuery(this).hasClass('open')) {
        jQuery(this).removeClass('open');
        jQuery(this).addClass('close');
        jQuery('#app-main-4059 > ul').slideDown(100);
        return false;
    } else {
        jQuery(this).removeClass('close');
        jQuery(this).addClass('open');
        jQuery('#app-main-4059 > ul').slideUp(100);
        return false;
    }           
});

これはHTMLです:

<li class="has-submenu close" id="app-main-4059">
    <span class="menu-item-wrap no_icon">
        <a href="#" style=""><span class="link-text">FEATURES</span></a>
    </span>
    <div class="under"></div>
    <ul style="display: block; overflow: hidden;">
        <li id="app-main-3383"><span class="menu-item-wrap"><a href="http://appfessional.com/new/camps/" style=""><span class="link-text">Camps</span></a></span></li>
        <li id="app-main-3382"><span class="menu-item-wrap"><a href="http://appfessional.com/new/exercise/" style=""><span class="link-text">Exercise</span></a></span></li>
        <li id="app-main-3379"><span class="menu-item-wrap"><a href="http://appfessional.com/new/gear/" style=""><span class="link-text">Gear</span></a></span></li>
        <li id="app-main-2896"><span class="menu-item-wrap"><a href="http://appfessional.com/new/interviews/" style=""><span class="link-text">Interviews</span></a></span></li>
        <li id="app-main-2890"><span class="menu-item-wrap"><a href="http://appfessional.com/new/news/" style=""><span class="link-text">News</span></a></span></li>
        <li id="app-main-3381"><span class="menu-item-wrap"><a href="http://appfessional.com/new/nutrition/" style=""><span class="link-text">Nutrition</span></a></span></li>
        <li id="app-main-3384"><span class="menu-item-wrap"><a href="http://appfessional.com/new/profiles/" style=""><span class="link-text">Profiles</span></a></span></li>
        <li id="app-main-3378"><span class="menu-item-wrap"><a href="http://appfessional.com/new/style/" style=""><span class="link-text">Style</span></a></span></li>
        <li id="app-main-3380"><span class="menu-item-wrap"><a href="http://appfessional.com/new/social/" style=""><span class="link-text">Social</span></a></span></li>
        <li id="app-main-3377"><span class="menu-item-wrap"><a href="http://appfessional.com/new/travel/" style=""><span class="link-text">Travel</span></a></span></li>
    </ul>
</li>
4

2 に答える 2

3

event.target を試してみてください。ここでは、「FEATURES」の条件を記述する必要があります。

jQuery('#app-main-4059').addClass('open');
jQuery('#app-main-4059').click(function( event ) {
var target = jQuery(event.target);
if( target.is("li") ) {
    if (jQuery(this).hasClass('open')) {
        jQuery(this).removeClass('open');
        jQuery(this).addClass('close');
        jQuery('#app-main-4059 > ul').slideDown(100);
        return false;
    } else {
        jQuery(this).removeClass('close');
        jQuery(this).addClass('open');
        jQuery('#app-main-4059 > ul').slideUp(100);
        return false;
    }     
}      
});
于 2013-08-16T11:35:44.667 に答える