Как сделать select checkbox скрытым до нажатия на input?

Question

[Валерий Мадьяров]

Здравствуйте уважаемые!

Имеется код формы - в кратце

<div class="input">
                            <input type="text" name="name" required>
                            <span>Ваше имя</span>
                        </div>
                        <!--  -->
                        <div class="input">
                            <input type="text" name="phone" required>
                            <span>Номер телефона</span>
                        </div>

                        <div class="input">
                            <input type="text" name="phone" required>
                            <span>Ваш город</span>
                            <select name="form_select">
                                <option value="Nur-sultan" selected="selected">Нур-Султан</option>
                                <option value="Karaganda" >Караганда</option>
                            </select>

А так же имеется стили которые делают Input кликабельными.


Возможно ли сделать так что бы при нажатии на Input города, можно было сделать так что бы он становился видимым и на оборот до нажатия ?

Comments

[Дамир Шаниязов]

чего

[Валерий Мадьяров]

Дамир Шаниязов, Сложна?

[Валерий Мадьяров]

Дамир Шаниязов, не нажал чек бокса нет, нажал есть

[Дамир Шаниязов]

Валерий Мадьяров, Сложно читать и понять чего вы хотите. Я догадываюсь, что вы хотите. Правильнее будет изменить стили input'a, а не использовать javascript

[smilingcheater]

Почему в тегах битрикс? Текущая постановка к нему не имеет вообще никакого отношения

[Валерий Мадьяров]

smilingcheater, Извяночки, наверное на автомате поставил.

[PetrPo]

select checkbox скрытым до нажатия на input

submit button формы когда html

Answer 1

[Эдуард]

Раз уж тег Битрикс, делаем на нем:

<select id="city" name="form_select" class="hidden" >
	<option value="Nur-sultan" selected="selected">Нур-Султан</option>
	<option value="Karaganda">Караганда</option>
</select>

.hidden {
	display: none;
}

BX.ready(function() {
	BX.bind(BX('city'),  'click',  () => {
		BX.removeClass(BX('city'), 'hidden');
	});
});

Comments

[Валерий Мадьяров]

BX.ready(function() {
BX.bind(BX('city'), 'click', () => {
BX.removeClass(BX('city'), 'hidden');
});
});

Этот кусок кода прям на странице оставлять ?

понимаю вопрос тупой...

[Эдуард]

Валерий Мадьяров, этот кусок кода - JS. Я не знаю что у Вас там, если просто страница, то оставьте на ней, если компонент, то в файле script.js

[Валерий Мадьяров]

Эдуард, спасибо, уже понятнее