Javascript 引导导航转到区段

我希望有一个nav元素，包含多个可见部分和一个不可见部分，然后在第一个部分上有一个链接（a href），该链接可以通过编程将不可见的nav部分设置为可见并显示其内容。 我试着像这样做

 function MyClick(event){
            $(".nav").find(".active").removeClass("active");
            x = document.getElementById("artu");
            x.style.display="block";
            x.className += ' active';
            window.location.href = "#articolex";
            window.location.hash = '#articolex';
       }

或者最好检查本文档中的完整代码 但它不起作用

在我的实际代码（不是JSFIDLE）中，javascript函数起作用了，它确实将所需的选项卡设置为可见和活动，但仍然没有将“页面内容”更改为我想要的部分。我不知道为什么JSFIDLE没有像我的实际代码那样做。。。但无论如何，我的问题是：我需要链接作为实际点击导航项目

---

请告知。

使用href和onclick的

标记实际上不起作用。由于您已经在使用jQuery，因此可以通过为link元素提供一个id并使用以下命令，更轻松地使用jQuery单击事件：

$("#goto").click(function() {
    $(".nav").find('.active').removeClass('active');
    $("#artu").css("display", "block");
    $("#artu").addClass("active");
    $("#home").removeClass("in active");
    $("#articolex").addClass("in active");
    //etc
});

下面是完整的片段


$（“#转到”）。单击（函数（）{
$（“.nav”）.find（'.active'）.removeClass（'active'）；
$（“#artu”）.css（“显示”、“块”）；
$（“artu”）.addClass（“活动”）；
$（“#home”）.removeClass（“处于活动状态”）；
$（“#articolex”）.addClass（“处于活动状态”）；
//等
});
正文{
保证金：5px；
背景：#A6
}
/*选项卡导航*/
.导航标签{
保证金：0；
填充：0；
边界：0；
}
.导航选项卡>li>a{
背景：#达达达；
边界半径：0；
盒影：插入0-8px7px-9pxRGBA（0,0,0,4），-2px-2px5px-2pxRGBA（0,0,0,4）；
}
.nav选项卡>li.active>a，
.nav选项卡>li.active>a:悬停{
背景:#f5；
框阴影：插入0 rgba（0,0,0,4），-2px-3px 5px-2px rgba（0,0,0,4）；
}
/*选项卡内容*/
.选项卡窗格{
背景:#f5；
长方体阴影：0.4×rgba（0,0,0,4）；
边界半径：0；
文本对齐：居中；
填充：10px；
}

东西










家

一些内容

菜单1

其他内容

菜单4

特别内容

菜单2

另一内容

为什么要将jquery与普通javascript混合使用？第3行到第5行可以替换为$（'#artu'）.show（）.addClass（'active'）@用户1137313这里的问题是，在clickEvent上，您必须在
菜单中找到
标记，并设置属性
aria expanded=“false”
，并将
菜单4的相同属性设置为true。给我一点时间，我会很快在这里发布工作代码，但我希望你得到一般的想法，它仍然有同样的问题。不显示菜单4的内容。@MikeRoss是的，我现在看到它不显示内容，但会转到新选项卡。我会设法解决这个问题。。。