jquery show / hide div默认显示全部

Question

现在，下面的代码工作正常，但我想默认显示所有房间div。我该怎么做？

HTML：

<select id="room_type">
    <option value="">-- Type --</option>
    <option value="oneroom">One room</option>
    <option value="tworoom">Two room</option>
</select>

<div id="oneroom" style="display:none">
    CONTENT 1
</div>
<div id="tworoom" style="display:none">
    CONTENT 2
</div>

的Javascript

<script type="text/javascript">
;(function ($) {
    $('#room_type').change(function(){
        var location = $(this).val(),
            div = $('#' + location);
        $("div[id$='room']").hide();
        div.show();
    });
})(jQuery);
</script>

Answer 1

要么删除div上的style="display:none"，要么在更改事件处理程序之前添加此jQuery：$('div').show();

Answer 2

看这个JSfiddle

代码：

(function ($) {

    $("#oneroom, #tworoom").show(); // <-- This

    $('#room_type').change(function(){
        var location = $(this).val(),
            div = $('#' + location);
        $("div[id$='room']").hide();
        div.show();
    });
})(jQuery);