2014-10-30 1 views
0

Я переписываю li с тем же именем класса. Когда один лик открывается, другой ли поднимается вверх.toggleClass на слайде вверх

У каждого ли есть знак плюса рядом с ним, и при щелчке на нем щелчок мыши, чтобы развернуть знак плюс, становится минусом, переключая класс fa-plus на fa-minus.

Однако, когда открытая ли автоматически открывается, потому что нажата другая личность, значок остается как минус, а не является плюсом.

Вот мой jsfiddle: http://jsfiddle.net/a3mn8yoo/

<script> 
$(function() { 

    $(".has_submenu a").click(function() { 
     $(".has_submenu a").not(this).next().slideUp(); 
     $(this).closest(".has_submenu").find(".refinement-submenu").slideToggle(); 
     $(this).closest(".has_submenu").find(".fa-plus, .fa-minus").toggleClass('fa-plus fa-minus'); 
     return false; 
    }); 

}); 


</script> 

<style> 
.has_submenu .refinement-submenu {display:none;} 
</style> 


<ul> 
    <li class="has_submenu"> 
     <a href="#">Refine by 1 <i class="fa fa-plus"></i></a> 
     <ul class="refinement-submenu"> 
      <li><a href="">Silverstone</a></li> 
      <li><a href="">Prestwold Hall</a></li> 
     </ul> 
    </li> 
    <li class="has_submenu"> 
     <a href="#">Refine by 2 <i class="fa fa-plus"></i></a> 
     <ul class="refinement-submenu"> 
      <li><a href="">£25</a></li> 
      <li><a href="">£50</a></li> 
     </ul> 
    </li> 
    <li class="has_submenu"> 
     <a href="#">Refine by 3 <i class="fa fa-plus"></i></a> 
     <ul class="refinement-submenu"> 
      <li><a href="">London</a></li> 
      <li><a href="">South West</a></li> 
     </ul> 
    </li>  
</ul> 

Любые идеи?

ответ

1

Вы код провел идею уже, подобным образом вы slideUp другие дивы, вы можете переключить "-"

$(".has_submenu a").not(this).find(" .fa-minus").toggleClass('fa-plus fa-minus'); 

http://jsfiddle.net/a3mn8yoo/1/

0

Вы имели:

$(this).closest(".has_submenu").find(".fa-plus, .fa-minus"); 

I добавлено:

$(this).closest(".has_submenu").find(".fa-plus, .fa-minus").end().siblings().find('.fa-minus').toggleClass('fa-plus fa-minus'); 

Попробуйте обновленную скрипту:

http://jsfiddle.net/a3mn8yoo/6/