jQuery 菜单正在切换下面的块 + 链接到活动块答案

【问题标题】：jQuery menu which is switching a blocks below + links to active blocksjQuery 菜单正在切换下面的块 + 链接到活动块
【发布时间】：2013-07-25 19:09:46
【问题描述】：

所以我做了一个简单的菜单来切换下面的块，没关系 - 这是我的JS Fiddle。但我需要能够从外部链接到这些块。

很难用语言来描述，所以我举个例子—— You will find a menu there and you will be on a "Fetures" menu item，这里是link on a second menu item - "Demo"。

这是我的代码：

<div class="wrap">
    <ul>
        <li><a id="linkOne" href="#/first">First</a></li>
        <li><a id="linkTwo" href="#/second">Second</a></li>
        <li><a id="linkThree" href="#/third">Third</a></li>
    </ul>
    <p id="first">First Paragraph</p>
    <p id="second">Second Paragraph</p>
    <p id="third">Third Paragraph</p>

和js：

$(document).ready(function(){
    $('#linkOne').click(function(){
        $('#first').show();
        $('#second').hide();
        $('#third').hide();
    });
    $('#linkTwo').click(function(){
        $('#first').hide();
        $('#second').show();
        $('#third').hide();
    });
    $('#linkThree').click(function(){
        $('#first').hide();
        $('#second').hide();
        $('#third').show();
    });
});

我没有找到任何关于这方面的教程或好的例子，所以如果你知道的话，请给我留言。

【问题讨论】：

我不知道问题是什么。
我给了dev7studios.com的两个链接。有一个 jQuery 菜单显示或隐藏下面的部分 + 你可以像这样链接到确切的菜单项 - support menu item - 他们是如何使链接到确切的菜单项成为可能的？

标签： jquery hyperlink toggle

【解决方案1】：

这会获取哈希 (#) 并查找 ID 与哈希匹配的 div。

if(window.location.hash){
    var whichDiv = window.location.hash;
    $(whichDiv).show();
}

您需要编辑这些以使哈希与段落的 ID 匹配（删除了 /）：

<li><a id="linkOne" href="#first">First</a></li>
<li><a id="linkTwo" href="#second">Second</a></li>
<li><a id="linkThree" href="#third">Third</a></li>

【讨论】：

【解决方案2】：

我主张使用点击而不是显示，但同样的想法：

$(document).ready(function(){

$('#linkOne').click(function(){
    $('#first').show();
    $('#second').hide();
    $('#third').hide();
});
$('#linkTwo').click(function(){
    $('#first').hide();
    $('#second').show();
    $('#third').hide();
});
    $('#linkThree').click(function(){
    $('#first').hide();
    $('#second').hide();
    $('#third').show();
});

if(location.hash) $(location.hash).click();
});

【讨论】：