简体   繁体   English

如何从下拉列表中选择特定的选项值以显示隐藏的div?

[英]How do I select a specific option value from a drop down list to show a hidden div?

I have a drop down list that has 4 options, so what I want is when I click on the value "from" it shows a hidden div (used CSS to hide this div "display: none;"). 我有一个包含4个选项的下拉列表,所以我想要的是当我单击值“ from”时它显示一个隐藏的div(用于隐藏此div的CSS“ display:none;”)。 anyone can help me with that? 有人可以帮我吗? THANKS! 谢谢!

Html: HTML:

<select id="type">
<option value="">--select--</option>
<option value="category">Category</option>
<option value="brand_name">Brand</option>
<option value="campaign_name">Campaign</option>
<option value="from">Recap date</option>
</select>
</label>

<div id="showfrom">
<input type="text" class="filter" value="02-16-2012" id="from">
</div> 

Js: Js:

$("#type").change(function() {
var selected = $(this).find(':selected').val();
if (selected == from) {
$("#showfrom").show();
}
});

from should be a string literal. from应该是字符串文字。 Also you need to hide if something else is selected so better if you can use .toggle() 另外,如果选择其他选项,则还需要隐藏,如果可以使用.toggle()会更好。

$("#type").change(function () {
    $("#showfrom").toggle(this.value == 'from');
}).change();//to set the initial state

Demo: Fiddle 演示: 小提琴

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM