Javascript隐藏/显示使用JQuery的标签

Question

我有一个关于如何使用jQuery标签（点击链接按钮来显示/隐藏某些div）的快速问题。

HTML链接：

<table class='layout tabs'> 
<tr> 
    <td><a href="#site">Site</a></td> 
    <td><a href="#siteno">Number</a></td> 
</tr> 
<tr> 
    <td><a href="#student">Student</a></td> 

    <td><a href="#school">School</a></td> 
</tr> 
</table> 
</div> 

的div需要显示/隐藏：在DIV ID链接的href匹配

<div id="site"> 
    <table class='explore'> 
    <thead class='ui-widget-header'> 
     <tr> 
     <th class=' sortable'> 
      Site 
     </th> 

     <th class=' sortable'> 
      Number 
     </th> 
     </tr> 
     </thead> 
     </table> 
</div> 

Answer 1

$("table.tabs a").click(function() { 
    var id = $(this).attr("href"); 
    var div = $(id); 
    div.toggle(); 
}); 

这将让你正是你“问。但是，我怀疑你也想在显示一个div时隐藏所有其他的div。真正？

好的，现在你已经回复说它是真的，这是你的新代码。 你也应该在你的所有DIV中添加一个类（在我的代码 - “tab-div”中），以便让它们轻松地在一起进行选择。

$("table.tabs a").click(function() { 
    var id = $(this).attr("href"); 

    // Hide all the tab divs 
    $(".tab-div").hide(); 

    // Then show the one that's been clicked 
    $(id).show(); 
});