当选择或取消选择特定的下拉选项时，切换隐藏的div

Question

我能够在stackoverflow上找到一个示例来执行我​​想要的操作。然而，当我在我的代码中实现它，并选择将显示一个隐藏的div的选项时，隐藏的div不会出现并且不知道为什么。

HTML：

​​

CSS：

/*Simple Dropdown box*/ 
    .selectmenu{ 
     font-family: arial, sans-serif, tahoma; 
     -webkit-appearance: none; /*Removes default chrome and safari style*/ 
     -moz-appearance: none; /* Removes Default Firefox style*/ 
     background: white; 
     width: 80px; /*Width of select dropdown to give space for arrow image*/ 
     text-indent: 0.01px; /* Removes default arrow from firefox*/ 
     text-overflow: ""; /*Removes default arrow from firefox*/ /*My custom style for fonts*/ 
     color: black; 
     border-radius: 2px; 
     padding: 5px; 
     border:0 !important; 
     box-shadow: inset 0 0 1px rgba(000,000,000, 0.5); 
     font-size: 1.2em; 
    } 

的Javascript：

$(function() { 
    $('#select').change(function(){ 
     if ($(this).val() == "3") { 
      $('#hidden_div').show(); 
     } else { 
      $('#hidden_div').hide(); 
     } 
    }); 
}); 

Answer 1

我试过你的代码。这是工作。也许尝试一些替代品。使用.css（） jQuery的功能将显示从改为改为块，反之亦然。

$(function() { 
    $('#select').change(function(){ 
     if ($(this).val() == "3") { 
      $('#hidden_div').css('display','block'); 
     } else { 
      $('#hidden_div').css('display','none'); 
     } 
    }); 
}); 

下面是截图，以证明它的工作原理：

希望这有助于。祝你好运！