Question

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

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="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();
} );

Javascript使用JQuery隐藏/显示标签

1 个答案: