Появление кнопки Очистить после выбора/заполнения поля
Здравствуйте.
Имеется форма с разными полями: checkbox,radio,select,text. Span очищает форму. Подскажите, пожалуйста, как сделать чтобы Span был виден после того, как любое из полей выбрано/заполнено (и соответственно пропадал, если поле не выбрано). <form id="block_search" name="block_search" method="GET" action="/search/"> <div><input id="must1" name="must1" value="ON" type="checkbox"><label for="must1">Фотографии</div> <div><input id="f1" value="0" name="f1" type="radio"><label class="field_label" for="f1">Возможен торг</label></div> <div><select id="bs_44" class="form-control" size="1" name="f_44"><option value="1">Гибрид</option><option value="2">Электро</option></select></div> <div><input id="bs_16" class="form-control" placeholder="Адрес сайта" name="f_16" value="" type="text"></div> </form> <span class="reset">Очистить</span>
$(".reset").click(function(){$("#block_search")[0].reset();
|
<form id="block_search" name="block_search" method="GET" action="/search/">
<div><input id="must1" name="must1" value="ON" type="checkbox"><label for="must1">Фотографии</div>
<div><input id="f1" value="0" name="f1" type="radio"><label class="field_label" for="f1">Возможен торг</label></div>
<div><select id="bs_44" class="form-control" size="1" name="f_44"><option value="1">Гибрид</option><option value="2">Электро</option></select></div>
<div><input id="bs_16" class="form-control" placeholder="Адрес сайта" name="f_16" value="" type="text"></div>
</form>
<span class="reset" style="display:none">Очистить</span>
<script>
block_search.oninput = e => document.querySelector('.reset').style.display =
[].some.call(document.querySelectorAll('#block_search input'), el=> el.type == 'text'? el.value.length : el.checked)? 'block':'none';
</script>
|
Цитата:
el.value.trim() |
В случае с select span не появляется.
|
Цитата:
|
Да, моя ошибка, должно быть так:
<select id="bs_44" class="form-control" size="1" name="f_44"> <option value="">Выберите категорию</option> <option value="1">Гибрид</option> <option value="2">Электро</option> </select> При выборе Гибрид или Электро span не появляется. |
dasha862,
block_search.oninput = e => document.querySelector('.reset').style.display =
[].some.call(document.querySelectorAll('#block_search input, #block_search select'), el=> (el.type == 'text' || el.tagName == 'SELECT')? el.value.length : el.checked)? 'block':'none';
|
Цитата:
|
Большое Вам Спасибо!
|
| Часовой пояс GMT +3, время: 21:27. |