Отображение элементов на основе выбора выбора окна

Question

У меня есть один поле выбора, которое скрывает и отображает элементы на основе его выбора.

В JS ПААГ

function showhide() { 

    $("div.brandDiv").hide(); 
    $("select.slct").bind('change', function() { 

     $('div.brandDiv').hide(); 
     var targetId = $(this).val(); 
     $('div#' + targetId).show(); 
    }); 
} 

В HTML вызов функции ПоказатьСкрыть()

<select name="ex" class="slct"> 

, а затем дивы с идентификатором, не и да.

< DIV ID = «ош» класс = «brandDiv»>

  <input type="text" name='num' class="numbersonly" maxlength="2" ></input> 
       </div> 

Сво работает отлично

Проблемы, когда я обновить страницу он просто отображает поле выбора с последок выбранным вариантом, но не на основе элементов по этому выбору

Например, если у меня есть 2 выбора опций коробки да и нет и если пользователь выбирает да это показывает привет и нет, это шоу, но КН en i обновить страницу, она правильно показывает да или нет, но не приветствует или

Я не очень эксперт. Пожалуйста, помогите.

Answer 1

Самый простой вариант - инициировать событие изменения. Так что попробовать что-то вроде:

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

Answer 2

Здесь я сделал полные баки для выше вопроса, когда проба демонстрационной ссылки, как показано ниже:

Демо:http://codebins.com/bin/4ldqp9q

HTML:

<div id="panel"> 
    <select name="ex" class="slct"> 
    <option value="div1"> 
     Option1 
    </option> 
    <option value="div2"> 
     Option2 
    </option> 
    <option value="div3"> 
     Option3 
    </option> 
    </select> 
    <div id="div1" class="brandDiv"> 
    Here is content for brand Div 1. 
    </div> 
    <div id="div2" class="brandDiv"> 
    Here is content for brand Div 2. 
    </div> 
    <div id="div3" class="brandDiv"> 
    Here is content for brand Div 3. 
    </div> 
</div> 

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