Javascript 在引导框架中隐藏/显示元素

在Mac上使用尾波2 使用HTML、CSS、JS和Bootstrap3（通过CDN）

单一网页

系列链接 在第二列中放置各种表单元素

目标：单击引导网格中包含的特定链接 单击特定链接时，应显示相关内容，而其他内容则全部隐藏

根据前面回答的问题改编的代码，位于fiddle@YsmVn

现在获取JS Post错误。我不懂JS，但我想我需要一个替代.sibles（）.hide（）的方法

我的相关代码是

<a href="" class="one">One</a>
<a href="" class="two">Two</a>
<a href="" class="three">Three</a>
<a href="" class="four">Four</a><br /><br />

<div class="container">
    <div class="row">
        <div class="col-md-3">
            <div id="one">One</div>
        </div>
        <div class="col-md-3">
             <div id="two">Two</div>
        </div>
        <div class="col-md-3">
            <div id="three">Three</div>
        </div>
        <div class="col-md-3">
            <div id="four">Four</div><br/><br/>
        </div>
</div>

请注意，您提到的小提琴的直接链接如下：

不知道你真正的目标是什么，只是想知道你是否有 是否考虑使用引导选项卡或折叠组件？事实上 现在，你似乎正在走上重新发明轮子的道路

这是您发布的代码的另一个版本， 有一个工作样本。在此示例中，div最初都是 设置为显示，但显然可以更改

JavaScript

$(document).ready(function(){
    // Show chosen div, and hide all others
    $("#my-nav a").click(function (e) {
        e.preventDefault();
        $('#my-nav a').removeClass('active');
        $(this).addClass('active');
        $('.my-section').hide();
        var sectionActive = $(this).data('section');
        $('#' + sectionActive).show();
    });
});

HTML

<div id="my-nav">
   <a href="#" data-section="one">One</a>
   <a href="#" data-section="two">Two</a>
   <a href="#" data-section="three">Three</a>
   <a href="#" data-section="four">Four</a>
</div>

<div class="container">
    <div class="row">
        <div class="col-md-3">
            <div id="one" class="my-section">One</div>
        </div>
        <div class="col-md-3">
             <div id="two" class="my-section">Two</div>
        </div>
        <div class="col-md-3">
            <div id="three" class="my-section">Three</div>
        </div>
        <div class="col-md-3">
            <div id="four" class="my-section">Four</div>
        </div>
    </div>
</div>

一个
两个
三
四

<div id="my-nav">
   <a href="#" data-section="one">One</a>
   <a href="#" data-section="two">Two</a>
   <a href="#" data-section="three">Three</a>
   <a href="#" data-section="four">Four</a>
</div>

<div class="container">
    <div class="row">
        <div class="col-md-3">
            <div id="one" class="my-section">One</div>
        </div>
        <div class="col-md-3">
             <div id="two" class="my-section">Two</div>
        </div>
        <div class="col-md-3">
            <div id="three" class="my-section">Three</div>
        </div>
        <div class="col-md-3">
            <div id="four" class="my-section">Four</div>
        </div>
    </div>
</div>