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

Question

我有一个下拉列表，有4个选项，所以我想要的是当我点击值“从”它显示一个隐藏的div（用CSS来隐藏这个div“display：none;”）。任何人都可以帮助我呢？谢谢！

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：

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

Answer 1

from应该是一个字符串文字。另外你需要隐藏，如果别的选择，以便更好，如果你可以使用.toggle()

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

演示：从Fiddle