Блондинка,
<!DOCTYPE html> <html> <head> <title>Untitled</title> <meta charset="utf-8"> </head> <body> <form action="http://"> <select onchange="var x = this.value;this.form.reset(); this.value = x"> <option value="">Выбор здесь сбросит остальные селекторы</option> <option value="1">Вариант 1</option> <option value="2">Вариант 2</option> <option value="3">Вариант 3</option> </select> <select> <option value="">Выберите что-нибудь</option> <option value="1">Вариант 1</option> <option value="2">Вариант 2</option> <option value="3">Вариант 3</option> </select> <select> <option value="">Выберите что-нибудь</option> <option value="1">Вариант 1</option> <option value="2">Вариант 2</option> <option value="3">Вариант 3</option> </select> </form> </body> </html> |
рони,
вот это именно то что нужно, только надо применить сразу ко всем селекторам и полю для года, только один раз, а при изменинии второго параметра не применять... |
рони,
я пытаюсь объяснить что неизвестно с какого элемента пользователь начнёт и в какой последовательности будет действовать... |
Цитата:
|
возможно ли один раз отследить событие во всех 4ех элементах, а после стирания прекратить отслеживать?
|
рони,
вот страНица <!DOCTYPE html> <html lang="ru"> <head> <meta charset="utf-8"> <title></title> <style> body { padding: 0 15px; } div { min-width: 430px; border: 1px solid #ccc; padding: 5px; margin-top: 5px; } span.text { font: italic 14px serif; color: hsl(207, 100%, 50%); } span.background { display: inline-block; background: -webkit-linear-gradient(top, hsl(207, 100%, 85%), hsl(207, 100%, 99%)); background: -moz-linear-gradient(top, hsl(207, 100%, 85%), hsl(207, 100%, 99%)); background: -o-linear-gradient(top, hsl(207, 100%, 85%), hsl(207, 100%, 99%)); background: linear-gradient(to top, hsl(207, 100%, 90%), hsl(207, 100%, 99%)); } #day { width: 122px; background: hsl(207, 100%, 90%); color: hsl(207, 100%, 50%); border: 1px solid hsl(207, 100%, 50%); } #date { width: 41px; background: hsl(207, 100%, 90%); color: hsl(207, 100%, 50%); border: 1px solid hsl(207, 100%, 50%); } #month { width: 89px; background: hsl(207, 100%, 90%); color: hsl(207, 100%, 50%); border: 1px solid hsl(207, 100%, 50%); } #year { width: 50px; height: 19px; padding-left : 5px; background: transparent; color: hsl(207, 100%, 50%); border: 1px solid hsl(207, 100%, 50%); } #type_year { width: 115px; background: hsl(207, 100%, 90%); color: hsl(207, 100%, 50%); border: 1px solid hsl(207, 100%, 50%); } #stopdata, #startdata { width: 91px; height: 19px; background: hsl(207, 100%, 90%); color: hsl(207, 100%, 50%); border: 1px solid hsl(207, 100%, 50%); display: inline-block: text-align: center; } input, select { font: 14px serif; } input[type=number], input[type=date] { -webkit-appearance: none; -moz-appearance: none; appearance: none; } input[type=date]::-webkit-calendar-picker-indicator { display: none; } input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; } input[type='number'] { -moz-appearance: textfield; } button { background: hsl(207, 100%, 90%); color: hsl(207, 100%, 50%); border: 1px solid hsl(207, 100%, 50%); font: 14px serif; position: relative; right: 2px; } </style> <script> document.addEventListener('DOMContentLoaded', function() { var d = new Date(); document.querySelector('#day').value = d.getDay() document.querySelector('#date').value = d.getDate(); document.querySelector('#month').value = d.getMonth()+1; document.querySelector('#year').value = d.getFullYear(); document.querySelector('#startdata').value = d.getFullYear() + '-01-01'; document.querySelector('#stopdata').value = d.getFullYear() + '-12-31'; }); </script> </head> <body> <div> <span class="text">Выберите нужные компоненты даты и установите нужные значения.</span><br> <select id="day"> <option value=""></option> <option value="1">Понедельник</option> <option value="2">Вторник</option> <option value="3">Среда</option> <option value="4">Четверг</option> <option value="5">Пятница</option> <option value="6">Суббота</option> <option value="0">Воскресенье</option> </select><br/> <select id="date"> <option value=""></option> <option value="01">1</option> <option value="02">2</option> <option value="03">3</option> <option value="04">4</option> <option value="05">5</option> <option value="06">6</option> <option value="07">7</option> <option value="08"> 8</option> <option value="09">9</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> <option value="16">16</option> <option value="17">17</option> <option value="18">18</option> <option value="19">19</option> <option value="20">20</option> <option value="21">21</option> <option value="22">22</option> <option value="23">23</option> <option value="24">24</option> <option value="25">25</option> <option value="26">26</option> <option value="27">27</option> <option value="28">28</option> <option value="29">29</option> <option value="30">30</option> <option value="31">31</option> </select> <select id="month"> <option value=""></option> <option value="1">января</option> <option value="2">февраля</option> <option value="3">марта</option> <option value="4">апреля</option> <option value="5">мая</option> <option value="6">июня</option> <option value="7">июля</option> <option value="8">августа</option> <option value="9">сентября</option> <option value="10">октября</option> <option value="11">ноября</option> <option value="12">декабря</option> </select> <span class="background"> <input type="number" id="year"/> </span> <select id="type_year"> <option value="01" selected>любой</option> <option value="02">простой</option> <option value="03">высокосный</option> </select><br><br> <span class="text">Установите начало периода.</span><br> <input type="date" id="startdata"/><br/> <span class="text">Установите окончание периода.</span><br> <input type="date" id="stopdata"/><br><br> <button type="button">Начать поиск</button> <button type="reset">Удалить результат и введённые данные</button> </div> <div id="rezultat">display none </div> </body> </html> |
возможно ли при изменинии значений элементов с id day, id date, id month, id year, id type_year отменить действие строк 43-46? чтобы селектед присвоился первым опциям с пустым value, и value в поле для года стерлось...
так возможно? |
???
|
???
|
возможно ли при событии onchange элементов с id day, id date, id month, id year, id type_year отменить действие строк 43-46? чтобы селектед присвоился первым опциям с пустым value, и value в поле для года стерлось...
так возможно? вот страницы <!DOCTYPE html> <html lang="ru"> <head> <meta charset="utf-8"> <title></title> <style> body { padding: 0 15px; } div { min-width: 430px; border: 1px solid #ccc; padding: 5px; margin-top: 5px; } span.text { font: italic 14px serif; color: hsl(207, 100%, 50%); } span.background { display: inline-block; background: -webkit-linear-gradient(top, hsl(207, 100%, 85%), hsl(207, 100%, 99%)); background: -moz-linear-gradient(top, hsl(207, 100%, 85%), hsl(207, 100%, 99%)); background: -o-linear-gradient(top, hsl(207, 100%, 85%), hsl(207, 100%, 99%)); background: linear-gradient(to top, hsl(207, 100%, 90%), hsl(207, 100%, 99%)); } #day { width: 122px; background: hsl(207, 100%, 90%); color: hsl(207, 100%, 50%); border: 1px solid hsl(207, 100%, 50%); } #date { width: 41px; background: hsl(207, 100%, 90%); color: hsl(207, 100%, 50%); border: 1px solid hsl(207, 100%, 50%); } #month { width: 89px; background: hsl(207, 100%, 90%); color: hsl(207, 100%, 50%); border: 1px solid hsl(207, 100%, 50%); } #year { width: 50px; height: 19px; padding-left : 5px; background: transparent; color: hsl(207, 100%, 50%); border: 1px solid hsl(207, 100%, 50%); } #type_year { width: 115px; background: hsl(207, 100%, 90%); color: hsl(207, 100%, 50%); border: 1px solid hsl(207, 100%, 50%); } #stopdata, #startdata { width: 91px; height: 19px; background: hsl(207, 100%, 90%); color: hsl(207, 100%, 50%); border: 1px solid hsl(207, 100%, 50%); display: inline-block: text-align: center; } input, select { font: 14px serif; } input[type=number], input[type=date] { -webkit-appearance: none; -moz-appearance: none; appearance: none; } input[type=date]::-webkit-calendar-picker-indicator { display: none; } input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; } input[type='number'] { -moz-appearance: textfield; } button { background: hsl(207, 100%, 90%); color: hsl(207, 100%, 50%); border: 1px solid hsl(207, 100%, 50%); font: 14px serif; position: relative; right: 2px; } </style> <script> document.addEventListener('DOMContentLoaded', function() { var d = new Date(); document.querySelector('#day').value = d.getDay() document.querySelector('#date').value = d.getDate(); document.querySelector('#month').value = d.getMonth()+1; document.querySelector('#year').value = d.getFullYear(); document.querySelector('#startdata').value = d.getFullYear() + '-01-01'; document.querySelector('#stopdata').value = d.getFullYear() + '-12-31'; }); </script> </head> <body> <div> <span class="text">Выберите нужные компоненты даты и установите нужные значения.</span><br> <select id="day"> <option value=""></option> <option value="1">Понедельник</option> <option value="2">Вторник</option> <option value="3">Среда</option> <option value="4">Четверг</option> <option value="5">Пятница</option> <option value="6">Суббота</option> <option value="0">Воскресенье</option> </select><br/> <select id="date"> <option value=""></option> <option value="01">1</option> <option value="02">2</option> <option value="03">3</option> <option value="04">4</option> <option value="05">5</option> <option value="06">6</option> <option value="07">7</option> <option value="08"> 8</option> <option value="09">9</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> <option value="16">16</option> <option value="17">17</option> <option value="18">18</option> <option value="19">19</option> <option value="20">20</option> <option value="21">21</option> <option value="22">22</option> <option value="23">23</option> <option value="24">24</option> <option value="25">25</option> <option value="26">26</option> <option value="27">27</option> <option value="28">28</option> <option value="29">29</option> <option value="30">30</option> <option value="31">31</option> </select> <select id="month"> <option value=""></option> <option value="1">января</option> <option value="2">февраля</option> <option value="3">марта</option> <option value="4">апреля</option> <option value="5">мая</option> <option value="6">июня</option> <option value="7">июля</option> <option value="8">августа</option> <option value="9">сентября</option> <option value="10">октября</option> <option value="11">ноября</option> <option value="12">декабря</option> </select> <span class="background"> <input type="number" id="year"/> </span> <select id="type_year"> <option value="01" selected>любой</option> <option value="02">простой</option> <option value="03">высокосный</option> </select><br><br> <span class="text">Установите начало периода.</span><br> <input type="date" id="startdata"/><br/> <span class="text">Установите окончание периода.</span><br> <input type="date" id="stopdata"/><br><br> <button type="button">Начать поиск</button> <button type="reset">Удалить результат и введённые данные</button> </div> <div id="rezultat">display none </div> </body> </html> |
Часовой пояс GMT +3, время: 15:42. |