javascript - 单击链接时显示/隐藏 div

Question

我试图在单击链接时显示和隐藏一个 div。我让 div 正确显示，但我希望当我单击另一个 div 时该 div 消失。这是我目前拥有的代码。

<script type="text/javascript"> 
            $(function() {
                $('#attach_silver').click(function() {
                    $('#sec_silver').show();
                    return false;
                });        
            });

            $(function() {
                $('#attach_gold').click(function() {
                    $('#sec_gold').show();
                    return false;
                });        
            });

            $(function() {
                $('#attach_platinum').click(function() {
                    $('#sec_platinum').show();
                    return false;
                });        
            });
        </script>

<a href="#" id="attach_silver">Silver</a>
    <a href="#" id="attach_gold">Gold</a>
    <a href="#" id="attach_platinum">Platinum</a>

<div id="sec_silver" style="display: none;">
        Hello world!! Silver              
    </div>

    <div id="sec_gold" style="display: none;">
        Hello world!! Gold             
    </div>

    <div id="sec_platinum" style="display: none;">
        Hello world!! Platinum            
    </div>

Answer 1

尝试添加一个类

<div id="sec_silver" style="display: none;" class="divclass">
    Hello world!! Silver              
</div>

<div id="sec_gold" style="display: none;" class="divclass">
    Hello world!! Gold             
</div>

<div id="sec_platinum" style="display: none;" class="divclass">
    Hello world!! Platinum            
</div>

在 jquery 中的这段代码之后

       $(function() {
                $('#attach_silver').click(function() {
                    $('.divclass').hide();
                    $('#sec_silver').show();
                    return false;
                });        
            });

            $(function() {
                $('#attach_gold').click(function() {
                    $('.divclass').hide();
                    $('#sec_gold').show();
                    return false;
                });        
            });

            $(function() {
                $('#attach_platinum').click(function() {
                    $('.divclass').hide();
                    $('#sec_platinum').show();
                    return false;
                });        
            });

在这种模式下，您可以在点击事件中隐藏所有 div，并显示您想要的 div