jquery - jQuery Select OnChange 也显示预选

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都设置为隐藏，需要手动更改pulldown来更新视图。

谢谢

Answer 1

您可以在使用.triggerHandler()注册事件处理程序后手动触发更改事件。

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

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

演示：小提琴