JQuery open / close navigation

I am building a navigation list with open and closed. But when I overlay nav ul li.test a to open the hidden ul button on click, nothing happens. When I go with nav ul li.test without hidden ul, it opens, but the link does not matter, they continue to perform the function as they are ul's parents. I think this is because .test closes after hidden ul, so they are all part of od.test. So I go with nav ul li.test a, but nothing happens. Here's a live example: www.studioi.hr/index.php

   <nav> 
      <ul>
        <li class="test"><a href="#">Menu 1 <i class="fa fa-plus"></i></a>
           <ul>
             <li><a href="#11">Sub menu 1</a></li>
             <li><a href="#12">Sub menu 2</a></li>   
             <li><a href="#13">Sub menu 3</a></li>                       
           </ul>
        </li>
        <li class="test"><a href="#">Menu 2 <i class="fa fa-plus"></i></a>
           <ul>
             <li><a href="#21">Sub menu 1</a></li>
             <li><a href="#22">Sub menu 2</a></li>                       
           </ul>
        </li> 
      </ul>
    </nav>


jQuery(document).ready(function () {
    jQuery('nav ul li.test a').click(function(){
        jQuery('nav ul ul').hide();
        jQuery('nav ul li a i').addClass('fa-plus').removeClass('fa-minus');
        jQuery(this).children('ul').show();
        jQuery(this).find('a > i').removeClass('fa-plus').addClass('fa-minus');
        return false;  
    });
});
+4
source share
1 answer

You should change this:

jQuery(document).ready(function () {
    jQuery('nav ul li.test a').click(function(){
        jQuery('nav ul ul').hide();
        jQuery('nav ul li a i').addClass('fa-plus').removeClass('fa-minus');
        jQuery(this).next('ul').show(); // change this
        jQuery(this).find('a > i').removeClass('fa-plus').addClass('fa-minus');
        //add this statement
        if(jQuery(this).attr('href') != "#"){
          location.href = jQuery(this).attr('href');
        }
        return false;  
    });
});

As I already showed, you have already changed it to your page :)

OP ul a, .

+2

Source: https://habr.com/ru/post/1544634/


All Articles