在点击下拉列表中隐藏其他下拉菜单

Question

我有一个下拉数据过滤器，使用它与同位素插件。

我试图关闭一个下拉列表，当另一个列表项被点击并打开下拉菜单时，向下旋转箭头。

我想知道我该如何实现这一目标。

这里是我的jsfiddle

 function toggle_visibility(id) { 
     var e = document.getElementById(id); 
     if(e.style.display == 'block') 
      e.style.display = 'none'; 
     else 
      e.style.display = 'block'; 

    } 

    $('#nfbt #nfbtv').click(function(){ 
     $(this).toggleClass('fbt nfv'); 
    }); 

我使用了jQuery从一个教程因此它是在HTML本身，如果我将它移动到自己的js文件这是行不通的。

Answer 1

Hi Please have a look to this link. I make it to work for your requirement. 
If you want to change the arrow then add a class which will have down arrow 
css when you toggling it to down. 

http://jsfiddle.net/aUkku/60/

Answer 2

我不知道你真正想要的，但这里是我试图使目标

function toggle_visibility(e) { 
    if (e.target.parentNode != this) return; 
    e.preventDefault(); 
    $(this).toggleClass('open').siblings('.hasarrow.open').removeClass('open'); 
} 
jQuery(function ($) { 
    $('.productfilters').on('click', '.hasarrow', toggle_visibility); 
}); 

http://jsfiddle.net/oceog/aUkku/4/