2016-07-15 1 views
1

を選択または非選択されたいずれかの隠されたdiv要素は私が望んでいた何をすべきかの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(); 
     } 
    }); 
}); 
+1

あなたのコードは正常に動作している...問題を実証するためのフィドルを共有してください... – Rayon

答えて

0

あなたのコードを試しました。それは働いている。たぶんいくつかの選択肢を試してみてください。 .css() jQueryの機能を使用して、表示をなしからブロックからその逆に変更します。ここで

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

は、それが動作することを証明するためにスクリーンショットです:

enter image description here

は、この情報がお役に立てば幸いです。がんばろう!

関連する問題