JQuery (.show .hide)

Question

JQuery (.show .hide)

0

У меня есть раскрывающееся меню. Если у пользователя есть какая-либо опция из выпадающего меню, скрипт отображает соответствующий div с дополнительной информацией.

Например, если пользователь выбирает вариант 2, сценарий отображает div "inf2".

Пока нет проблем, но в тех же случаях страница будет загружаться с уже выбранной опцией в выпадающем меню. Мне нужно каким-то образом заставить скрипт отображать соответствующий div, если какой-либо параметр уже выбран при загрузке страницы.

$(".addinf").hide();
$("#privacy").change(function() {
    switch ($(this).val()) {
        case "0":
            $(".addinf").hide().parent().find("#inf0").show();
            break;
        case "1":
            $(".addinf").hide().parent().find("#inf1").show();
            break;
        case "2":
            $(".addinf").hide().parent().find("#inf2").show();
            break;
    }
});

<select id="privacy" name="privacy">
    <option value="0">Option 0</option>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
</select>

<div id="inf0" class="addinf">Info 0</div>
<div id="inf1" class="addinf">Info 1</div>
<div id="inf2" class="addinf">Info2</div>

user 05 янв. 2014, в 15:02

Источник

Теги:

javascript

jquery

3 ответа

0

Просто запустите событие change в pageload

$(".addinf").hide();
$("#privacy").change(function () {
    switch ($(this).val()) {
        case "0":
            $(".addinf").hide().parent().find("#inf0").show();
            break;
        case "1":
            $(".addinf").hide().parent().find("#inf1").show();
            break;
        case "2":
            $(".addinf").hide().parent().find("#inf2").show();
            break;
    }
}).trigger('change');

adeneo 05 янв. 2014, в 11:15

0

Если меню уже видно, вы можете настроить их на скрытие.

попробуй это:

#inf0, #inf1, #inf2 {
  display: none;
}

Таким образом, они будут скрыты при запуске, и как только пользователь выберет что-то, они будут показаны!

Afzaal Ahmad Zeeshan 05 янв. 2014, в 10:29

Ещё вопросы

Aditya Singh · Accepted Answer · 2014-01-05T12-01-00.000Z

Попробуйте это: - http://jsfiddle.net/adiioo7/LCTZ7/

JS: -

$(".addinf").hide();

$("#privacy").change(function () {
    switch ($(this).val()) {
        case "0":
            $(".addinf").hide().parent().find("#inf0").show();
            break;
        case "1":
            $(".addinf").hide().parent().find("#inf1").show();
            break;
        case "2":
            $(".addinf").hide().parent().find("#inf2").show();
            break;
    }
});

$("#privacy").change();