Форум

Deymos · #1 (**permalink**) 18.12.2015, 12:39

Здравствуйте!

Как сделать, что пока пользователь не выберет какое-нибудь значение в select (name="len") блок <div class="variations_button"> будет скрыт?

Заранее спасибо!

Mess4me · #2 (**permalink**) 18.12.2015, 12:50

Deymos,

<!doctype html>
<html>
<head>
    <title></title>
    <meta charset='utf-8' />
    <style>
        .bl {
            display: none;
        }
    </style>
</head>
<body>

<select name="sel" id="sel">
    <option value="one">one</option>
    <option value="two">two</option>
    <option value="three">three</option>
</select>

<div id="toShow" class="variations_button bl">Hello, I am hidden block</div>
<script>
    var sel = document.getElementById('sel');
    sel.addEventListener('change', function (event) {
        if(this.value) document.getElementById('toShow').classList.remove('bl');
    })


</script>

</body>
</html>

Deymos · #3 (**permalink**) 21.12.2015, 11:50

супер круто, спасибо! А как сделать, что если переходим к пункту "Не выбрано" - автоматически все скрывается опять?

Mess4me · #4 (**permalink**) 21.12.2015, 12:17

Deymos,

<!doctype html>
<html>
<head>
    <title></title>
    <meta charset='utf-8' />
    <style>
        .bl {
            display: none;
        }
    </style>
</head>
<body>

<select name="sel" id="sel">
    <option value=""></option>
    <option value="one">one</option>
    <option value="two">two</option>
    <option value="three">three</option>
</select>

<div id="toShow" class="variations_button bl">Hello, I am hidden block</div>
<script>
    var sel = document.getElementById('sel');
    sel.addEventListener('change', function (event) {
        if(this.value)  { document.getElementById('toShow').classList.remove('bl') } else {
            document.getElementById('toShow').classList.add('bl')
        };

    })


</script>

</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript