03.03.2019, 15:27
|
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,989
|
|
Besprizornik,
вы чего в конце концов хотите? Если наши дни недели, то с чего у вас значение опции воскресенья равно 0?
|
Сообщение от Besprizornik
|
|
в дальнейшем надо будет показать что нельзя высчитать день/дату, для этого и есть пустая опция, которой присвоиться selected
|
Этого я вообще не понял - зачем вообще болтается в списке пустая опция и что значит нельзя высчитать дату?
|
|
03.03.2019, 15:32
|
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,989
|
|
|
Сообщение от Besprizornik
|
|
не должен показывать даты после 2400 года, а показывать пустые опции
|
Ну так причем тут d.getDay(), это уже задача обработчика изменения поля type=number. А для вашего списка с пустой опцией в конце, собственно она не обязательно должна стоять в конце, но если так охота, то как уже говорилось
document.querySelector('#day').options[(d.getDay()||7)-1].selected = true;
|
|
03.03.2019, 16:08
|
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,989
|
|
|
Сообщение от Besprizornik
|
|
скрипт не должен показывать даты после 2400 года, а показывать пустые опции
|
Ну даты то тут причем? Это ведь уже пользователь будет щелкать это поле, и эти изменения поля уже должен обрабатывать обработчик, который и должен проверять равен ли год 2400 и если да, то выбрать пустые опции списка. Или вы большой оптимист, планируете прожить почти 400 лет и дождаться таки этой даты?  Или пишем как Пушкин, для потомков? 
Собственно если уж и значения полей списка равны буржуйским дням недели, то можно и значению списка присваивать день недели вместо выбора опции по индексу. Тогда
<select class="day" id="day">
<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>
<option value=""></option>
<script>
var d = new Date();
document.querySelector('#day').value = d.getDay();
</script>
Для списка месяцев также берем как есть, коли первая его опция будет первый день со значением 0 (буржуйско-javascript формат), а пустая в конце.
Последний раз редактировалось laimas, 04.03.2019 в 02:22.
|
|
04.03.2019, 00:10
|
|
Кандидат Javascript-наук
|
|
Регистрация: 24.02.2019
Сообщений: 126
|
|
laimas, я просто пытался что-то понять и сделать из первого вврианта второй
<script>
var d = new Date();
document.addEventListener('DOMContentLoaded', function() {
document.querySelector('#day').options[d.getDay()||7].selected = true;
});
</script>
<select class="day" 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/><br/><br/>
<script>
var day=new Array('7','1','2','3','4','5','6')
document.addEventListener('DOMContentLoaded', function() {
document.querySelector('#day_x').options[d.getDay()||7].selected = true;
});
</script>
<select class="day_x" id="day_x">
<option value="0"></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>
</select><br/>
|
|
04.03.2019, 00:16
|
|
Кандидат Javascript-наук
|
|
Регистрация: 24.02.2019
Сообщений: 126
|
|
чтобы получить страничку с такими вот списками
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html><head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8"/>
<title>Сегодняшние день недели и дата через элементы формы на JS.</title>
<style>
body { color: #0000a0; font: 14px Georgia, 'Times New Roman', Times, serif; }
h1 { color: #ffffff; font: 16px Georgia, 'Times New Roman', Times, serif; text-shadow: 1px 1px #0005ff, -1px 1px #0005ff, 1px -1px #0005ff, -1px -1px #0005ff, 1px 0px #0005ff, 0px 1px #0005ff, -1px 0px #0005ff, 0px -1px #0005ff; -webkit-animation: h-pulsare 1.35s linear infinite; animation: h-pulsare 1.35s linear infinite;}
select { height: 26px; }
input { height: 22px; padding-left: 5px; }
select, input { background: #d7d7ff; color: #0000a0; border: 1px solid #0000a0; font: 16px Georgia, 'Times New Roman', Times, serif; line-height: 0; margin: 5px 3px; }
@-webkit-keyframes h-pulsare { 0%, 100% { color: #ffffff; text-shadow: 1px 1px #0005ff, -1px 1px #0005ff, 1px -1px #0005ff, -1px -1px #0005ff, 1px 0px #0005ff, 0px 1px #0005ff, -1px 0px #0005ff, 0px -1px #0005ff; } 50% { color: #d7d7ff; text-shadow: 1px 1px #0005ff, -1px 1px #0005ff, 1px -1px #0005ff, -1px -1px #0005ff, 1px 0px #0005ff, 0px 1px #0005ff, -1px 0px #0005ff, 0px -1px #0005ff, 0 0 30px #ff0055; } } @keyframes h-pulsare { 0%, 100% { color: #ffffff; text-shadow: 1px 1px #0005ff, -1px 1px #0005ff, 1px -1px #0005ff, -1px -1px #0005ff, 1px 0px #0005ff, 0px 1px #0005ff, -1px 0px #0005ff, 0px -1px #0005ff; } 50% { color: #d7d7ff; text-shadow: 1px 1px #0005ff, -1px 1px #0005ff, 1px -1px #0005ff, -1px -1px #0005ff, 1px 0px #0005ff, 0px 1px #0005ff, -1px 0px #0005ff, 0px -1px #0005ff, 0 0 30px #ff0055; } }
</style>
<script>
var d = new Date();
document.addEventListener('DOMContentLoaded', function() {
document.querySelector('#day').options[d.getDay()||7].selected = true;
document.querySelector('#date').options[d.getDate()].selected = true;
document.querySelector('#month').options[d.getMonth()+1].selected = true;
document.querySelector('#year').value = d.getFullYear();
});
</script>
</head><body>
<h1>Сегодняшние день недели и дата через элементы формы на JS.</h1>
<div class="seg">
Сегодня:<br/>
<select class="day" id="day">
<option value="0"></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>
</select><br/>
<select class="date" id="date">
<option value=""></option><option value="1">01</option><option value="2">02</option><option value="3">03</option><option value="4">04</option><option value="5">05</option><option value="6">06</option><option value="7">07</option><option value="8">08</option><option value="9">09</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 class="month" 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>
<input class="year" id="year" type="number" size="4" name="year" min="0" max="2400" step="1" value=""> <i>года</i>.
</div>
</body></html>
|
|
04.03.2019, 02:41
|
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,989
|
|
|
Сообщение от Besprizornik
|
|
я просто пытался что-то понять и сделать из первого вврианта второй
|
Ну как бы вы не тасовали свои списки, посредник между ними и объектом Date в виде массива совсем не нужен. Ваши списки содержат на один элемент больше чем соответствующих значений возвращаемых методами объекта Date. И можно управлять списками либо оперируя индексами их опций, либо значениями, слегка корректируя значения от методов.
А что касается функционала, года 2400, пустых опций, то тут скорее непорядок. Ведь хотя опции и пусты содержимым, они тем не менее доступны для выбора в списках. Если бы опции имели к примеру текст "Выберите..." и были выбранными по умолчанию, тогда наличие их в списках было бы логичным, а доступ к ним можно было бы запретить через disabled.
У вас же назначение данных опций определяется иным и это их предназначение никак не вписывается в логику. В такой концепции их либо вообще не должно быть в списках, а добавляться в них они должны по условию, либо эти опции в списках должны быть скрыты, и показываться по условию. И мало того, с появлением этих артистов на сцене должен накладываться запрет на появление других.
Но с другой стороны, если пустые опции появляются на сцене только по мере наступления 2400 года, то не проще ли выбросить эти пустые опции, сделав максимальным значением поля 2399 год? Ведь все элементы ваши получают значения по умолчанию равные элементам текущей даты, а далее выбор, который можно просто ограничить не "по предел", а "до предела".
Последний раз редактировалось laimas, 04.03.2019 в 02:43.
|
|
04.03.2019, 03:15
|
|
Кандидат Javascript-наук
|
|
Регистрация: 24.02.2019
Сообщений: 126
|
|
|
laimas,
я боялся что в воскресенье покажет пустоту, я дня три сношался пока что то получилось чтобы правильно показывало с тремя скриптами для каждого списка - отдельный скрипт...
пустые опции конечно выбираться не будут, а доступ к ним запретить через disabled дело 2ух минут если не меньше, в принципе пустые опции стоят первыми и они будут показываться если убрать атрибут селектед, тоесть надо будет при вводе значения 2400(к примеру) просто удалять атрибут...
|
|
04.03.2019, 03:31
|
|
Кандидат Javascript-наук
|
|
Регистрация: 24.02.2019
Сообщений: 126
|
|
|
если есть два одинаковых списка <select id="day"> и <select id="day-2">, то как я понимаю надо document.querySelector('#day', '#day-2').options[d.getDay()||7].selected = true;
|
|
04.03.2019, 03:35
|
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,989
|
|
|
Сообщение от Besprizornik
|
|
пустые опции конечно выбираться не будут, а доступ к ним запретить через disabled дело 2ух минут если не меньше
|
А давайте рассмотрим это вне контекста программы, отвлеченно, представив все ситуацией жизненной. Пусть вы режиссер спектакля, в котором также играете одну из ролей, которая определяет акты - первый, второй, третий ...
Для постановки спектакля вы заключили контракты с труппами артистов из различных театров. В каждой такой труппе есть по одному артисту, у которых вообще нет никакой роли, они выходят на сцену только в конце спектакля для поклона. Но при этом вы обязаны по контракту платить им жалование.
Правда глупо, расточительно и экономически нецелесообразно? Вот такая же ситуация и в вашем js-сценарии - есть те кто работают как лошади, и те кто вообще болтается бременем, но при этом жрут ресурсы. |
|
04.03.2019, 03:43
|
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,989
|
|
|
Сообщение от Besprizornik
|
|
как я понимаю надо document.querySelector('#day', '#day-2').options[d.getDay()||7].selected = true;
|
Нет, метод querySelector() выбирает один элемент по указанному селектору, если указать два, то будет возвращен только первый из них. |
|
|
|
