jquery显示/隐藏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);