jQuery Select OnChange Show Pre-Selected Too

Question

我正在使用下面的代碼來顯示/隱藏特定的div基於下拉選擇的選項。它工作正常，但我也想用相同的顯示/隱藏方法來使用預先選擇的選項。

<script type="text/javascript"> 
$(document).ready(function(){ 
$('.statecontent').hide(); 

$('#select').change(function() { 
     $('.statecontent').hide(); 
     $('.' + $(this).val()).show();  
    }); 
}); 
</script> 

<select id="select" class="cms_dropdown"> 
<option value="#">- Select One -</option> 
<option value="2">Lead</option> 
<option value="3">Quote</option> 
<option value="4">Confirmed</option> 
</select> 

<div class="statecontent 2"> 
Something 
</div> 

<div class="statecontent 2 3"> 
Something 
</div> 

<div class="statecontent 3 4"> 
Something 
</div> 

目前所有的div都設置爲隱藏，當你加載頁面時，需要手動更改下拉菜單來更新視圖。

感謝

Answer 1

您可以手動註冊使用.triggerHandler()事件處理火災後的變化情況。

$(document).ready(function() { 
    $('.statecontent').hide(); 

    $('#select').change(function() { 
     $('.statecontent').hide(); 
     $('.' + $(this).val()).show(); 
    }).triggerHandler('change'); 
}); 

演示：Fiddle