jquery切換不使用sibiling格

Question

我一直在我的頭上撓了幾個小時。這段代碼應該讓div可見，但它不起作用。

<div id="butbr"> 
    <div id="sup_nav"> 
    <div id="stup" class="bxt1"></div> 
    <div id="exep" class="bxt1"></div> 
    <div id="trat" class="bxt1"></div> 
    <div id="tstm" class="bxt2"></div> 
    <div id="whys" class="bxt3"></div> 
    <div id="regu" class="bxt3"></div> 
    </div> 
    <a id="btn_sup" href=""> 
    <div id="top_nav"> 
     <img src="../images/logos/mcwb.png" alt=""> 
    </div> 
    </a> 
</div> 

JS（我想在錯誤的地方在這裏，但控制檯不顯示任何錯誤）：

$(document).ready(function() { 
    $("#btn_sup").click(function(event) { 
    $("#sup_nav").show(); 
    }); 
}); 

CSS：

#butbr { 
    background-color: #FFF; 
    max-width: 80%; 
    margin-left: auto; 
    margin-right: auto; 
    min-width: 200px; 
    height: auto; 
    border-radius: 0 0 5px 5px; 
    /*box-shadow: 0px 3px 12px rgba(50, 50, 50, 0.58);*/ 
    box-shadow:0px 2px 2px rgba(50, 50, 50, 0.3); 
} 

#btn_sup { 
    width: 100%; 
    height: 60px; 
    display: block; 
    z-index: 5; 
} 

#sup_nav { 
    width: 75%; 
    height: 525px; 
    display: none; 
} 

Answer 1

你點擊在正在重新加載頁面的錨標籤上，停止默認操作

$(document).ready(function (e) { 
    $("#btn_sup").click(function (e) { 
     $("#sup_nav").show(); 
     e.preventDefault() 
    }); 
});