隐藏所有具有特定类的元素，并通过ID显示

Question

我已经使用jquery的hide()函数在页面加载时隐藏了特定类的所有元素。我试图在单击链接时基于它的ID再次显示该元素。

有7个元素被隐藏，每个元素具有不同的ID。当点击包含href="#element-id"的链接时，它应该只显示该元素并隐藏所有其他元素。

这里是我当前的代码隐藏要素：

var menu = $('div.menu-wrapper'); 
menu.hide(); 

，这里是我所认为应该显示的点击正确的元素：当点击

$('area').click(function() { 
    if($(this).attr('id') !== 'button') { 
     var target = $(this).attr('href'); 
     target.toggle('slide', { 
      direction: 'right' 
     }, 900);  
    } 
}); 

现在什么也没发生元素上。如何隐藏隐藏类menu-wrapper的所有元素，而只有类menu-wrapper的元素和正确的ID是可见的？

Answer 1

尝试

var menu = $('div.menu-wrapper'); 
menu.hide(); 
//register the event handler to area elements other than #button 
$('a:not(#button)').click(function() { 
    //hide all elements referred menu 
    menu.hide(); 
    //get the target jQuery wrapper, the href need to start with # 
    var target = $($(this).attr('href')); 
    target.toggle('slide', { 
     direction: 'right' 
    }, 900); 
});