2017-06-08 18 views
0

アクティブな要素が再度クリックされた場合に閉じているパネルを構築しようとしています。兄弟要素がクリックされている場合のみコンテンツが更新されます結果。どこに間違っているのか誰にでも見える?既に開いている場合はdivを表示して非表示にします

https://jsfiddle.net/9b3mecc2/

$('.sectors-list li').on('click', function(e){ 
    e.preventDefault(); 
    var order = $(this).index(); 
    $('.sub-sectors div').hide(); 
    $('.sub-sectors div').eq(order).show(); 
    if($('.digital-sectors').is(':visible') 
    && order === 0){ 
    $('.sub-sectors').removeClass('active'); 
    } else { 
     $('.sub-sectors').addClass('active'); 
    } 
}); 

答えて

1

何をしようとすると、あなたのコードを示すために、要素にイベント要素からの参照が欠落しているだけのことを、複雑ではないので、あなたは、擬似セレクタを使用して、CSSで行うことができます

チェックドキュメント:target

Browser support list

0

私は、この意志はうまくいくと思います。

$('.sectors-list li').on('click', function(e){ 
     e.preventDefault(); 
     var order = $(this).index(); 
     $('.sub-sectors div').hide(); 
     // $('.sub-sectors div').eq(order).show(); //moving this line to eles part 
     if($('.digital-sectors').is(':visible') 
     && order === 0){ 
      $('.sub-sectors').removeClass('active'); 
     } else { 
     $('.sub-sectors').addClass('active'); 
     $('.sub-sectors div').eq(order).show();  
     } 
    }); 
関連する問題