Javascript 隐藏所有div并使用jquery显示一个div

我已经在堆栈上寻找了一个我可以应用的答案，但是我对javascript不太在行

我有一个链接列表，需要显示一个隐藏的div。很简单。但这些链接中大约有8个，div必须占用相同的空间。因此，当你点击链接1（链接1的div出现），然后点击链接2，我需要链接1的div消失，链接2的div出现

目前，我正在使用jQuery的切换功能来获得我想要的效果，但是您必须单击链接两次才能再次隐藏信息

---

任何想法都将不胜感激

在不使用任何语法的情况下，您应该能够使用以下内容：

要隐藏链接本身：

//When a link is clicked...
$(".yourlink").click(function(){
     //Hide all of the links
     $(".yourlink").hide();
     //Show the selected link
     $(this).show();
});

同样，如果您想使用divs:（使用下面包含的HTML）

//Javascript
$（“.link”）。单击（函数（）
{
$（'div'）.hide（）；
$（'#'+$（this.attr（'name'））.show（）；
});
//HTML
在没有任何语法的情况下，您应该能够使用以下内容：

要隐藏链接本身：

//When a link is clicked...
$(".yourlink").click(function(){
     //Hide all of the links
     $(".yourlink").hide();
     //Show the selected link
     $(this).show();
});

同样，如果您想使用divs:（使用下面包含的HTML）

//Javascript
$（“.link”）。单击（函数（）
{
$（'div'）.hide（）；
$（'#'+$（this.attr（'name'））.show（）；
});
//HTML
使用.show（）来显示，使用.hide（）来隐藏，而不是切换。
使用.show（）来显示，使用.hide（）来隐藏，而不是切换。
在这种情况下，可以采用两种简单的方法

利用CSS帮助切换可见性
在jQuery中利用
show（）
/
hide（）
我建议使用CSS类来帮助您完成请求。创建一个类
.showObject{display:block；}
和另一个类
.hideObject{display:none；}
。拥有这些类后，可以利用jQuery函数
addClass（）
和
removeClass（）
修改display属性。
在这种情况下，可以采用两种简单的方法

    <a href="#" class="hider">link 1</a>
    <div id="div1" class="content" style="display:none;">
    </div>

    <a href="#" class="hider">link 2</a>
    <div id="div2" class="content" style="display:none;">
    </div>

    <a href="#" class="hider">link 3</a>
    <div id="div3" class="content" style="display:none;">
    </div>

    <a href="#" class="hider">link 4</a>
    <div id="div4" class="content" style="display:none;">
    </div>

    $(".hider").click(function(event){
        $(".content").hide();
        $(this).next().show();


    });

利用CSS帮助切换可见性
在jQuery中利用
show（）
/
hide（）
我建议使用CSS类来帮助您完成请求。创建一个类
.showObject{display:block；}
和另一个类
.hideObject{display:none；}
。拥有这些类后，可以利用jQuery函数
addClass（）
和
removeClass（）
修改显示属性。

    <a href="#" class="hider">link 1</a>
    <div id="div1" class="content" style="display:none;">
    </div>

    <a href="#" class="hider">link 2</a>
    <div id="div2" class="content" style="display:none;">
    </div>

    <a href="#" class="hider">link 3</a>
    <div id="div3" class="content" style="display:none;">
    </div>

    <a href="#" class="hider">link 4</a>
    <div id="div4" class="content" style="display:none;">
    </div>

    $(".hider").click(function(event){
        $(".content").hide();
        $(this).next().show();


    });

$（“.hider”）。单击（函数（事件）{
$（“.content”）.hide（）；
$（this.next（）.show（）；
});

$（“.hider”）。单击（函数（事件）{
$（“.content”）.hide（）；
$（this.next（）.show（）；
});
如果您想要最好/最快/最相关的帮助，请显示您的html和代码。如果您想要最好/最快/最相关的帮助，请显示您的html和代码。@BZink-我不确定他一开始在找什么。演示在实现中使用div。这正是我想要的。谢谢@一开始我不确定他在找什么。演示在实现中使用div。这正是我想要的。谢谢