根据选择框选择显示元素

我有一个选择框，根据其选择隐藏和显示元素。

在JS PAGE

function showhide() { $("div.brandDiv").hide(); $("select.slct").bind('change', function() { $('div.brandDiv').hide(); var targetId = $(this).val(); $('div#' + targetId).show(); }); } 

在HTML中调用函数showhide（）

然后div为id non和yes。

它的工作正常

问题是，当我刷新页面时，它只显示带有最后选择选项的选择框，但不显示基于该选择的元素

例如，如果我有2个选择框选项是和否，如果用户选择是它它显示你好并且没有它显示By但当我刷新页面时它正确显示是或否但不是你好或通过

我不是很专业。请帮忙。

Answer 1

这里我已完成上述问题的完整垃圾箱，一次试用演示链接如下图所示：

演示： http ： //codebins.com/bin/4ldqp9q

HTML：

 
   Option1   Option2   Option3   
 Here is content for brand Div 1. 
 
 Here is content for brand Div 2. 
 
 Here is content for brand Div 3. 
  

CSS：

 .slct{ border:1px solid #442288; } .brandDiv{ border:1px solid #225599; margin-top:5px; padding:5px; background:#a4c8ed; height:30px; display:none; } 

jQuery的：

 function showhide() { $('.brandDiv').hide('fast'); var targetId = $("select.slct").val(); $('div#' + targetId).show(1000); } $(function() { showhide(); $("select.slct").bind('change', showhide); }); 

演示： http ： //codebins.com/bin/4ldqp9q

Answer 2

最简单的选择是触发更改事件。 所以试试类似：

 $("select.slct").bind('change', function() { //your stuff }).trigger('change');