Javascript-форум - Найти все даты по определенным критериям

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Найти все даты по определенным критериям (https://javascript.ru/forum/misc/78189-najjti-vse-daty-po-opredelennym-kriteriyam.html)

Найти все даты по определенным критериям

Есть определенные критерии даты, день недели, число, месяц, год

<select name="day"></select><select name="date"></select><select name="month"></select><input name="year"><select name="type_year"><option>любой</option><option>простой</option><option>высокосный</option></select>

выбираем значения в нескольких элементах, не во всех....

есть период с и до

<input type="date"><input type="date"><button>Найти</button>
<div id="rezultat" style="display: none;">

возможно ли найти все эти даты, например пятница 13го или понедельник 1 января.

Цитата:

Сообщение от Блондинка

возможно ли найти все эти даты, например пятница 13го или понедельник 1 января

Разумеется. :yes:
Самый простой вариант - простым перебором в некоем интервале дат...

ksa,
а можно чуть подробнее, моих знаний не всегда хватит чтобы добавить ноль перед цифрой, из 0-9 сделать 00-09 для часов минут секунд

вот приблизительно html-код страницы

<!DOCTYPE html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <style>
    div {
    width: 560px;
    font: 14px serif;
    border: 1px solid #ccc;
    padding: 5px;
    margin-bottom: 5px;
    white-spage: nowrap; }
  </style>
  </head>
  <body>
  <div>
  <span>Выберите нужные параметры (день недели, число, месяц, год), не менее 2х параметров.</span><br>
  <select>
  <option>понедельник</option>
  <option>вторник</option>
  <option>среда</option>
  <option>четверг</option>
  <option>пятница</option>
  <option>суббота</option>
  <option>воскресенье</option>
  <option selected></option>
  </select>
  <select>
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
  <option>5</option>
  <option>6</option>
  <option>7</option>
  <option>8</optionb>
  <option>9</option>
  <option>10</option>
  <option>11</option>
  <option>12</option>
  <option>13</option>
  <option>14</option>
  <option>15</option>
  <option>16</option>
  <option>17</option>
  <option>18</option>
  <option>19</option>
  <option>20</option>
  <option>21</option>
  <option>22</option>
  <option>23</option>
  <option>24</option>
  <option>25</option>
  <option>26</option>
  <option>27</option>
  <option>28</option>
  <option>29</option>
  <option>30</option>
  <option>31</option>
  <option selected></option>
  </select>
  <select>
  <option>января</option></option>
  <option>февраля</option>
  <option>марта</option>
  <option>апреля</option>
  <option>мая</option>
  <option>июня</option>
  <option>июля</option>
  <option>августа</option>
  <option>сентября</option>
  <option>октября</option>
  <option>ноября</option>
  <option>декабря</option>
  <option selected></option>
  </select>
  <input size="4">
  <select>
  <option selected>любой</option>
  <option>простой</option>
  <option>высокосный</option>
  </select><br><br>
  <span>Установите начало периода.</span><br>
  <select>
  <option selected>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
  <option>5</option>
  <option>6</option>
  <option>7</option>
  <option>8</optionb>
  <option>9</option>
  <option>10</option>
  <option>11</option>
  <option>12</option>
  <option>13</option>
  <option>14</option>
  <option>15</option>
  <option>16</option>
  <option>17</option>
  <option>18</option>
  <option>19</option>
  <option>20</option>
  <option>21</option>
  <option>22</option>
  <option>23</option>
  <option>24</option>
  <option>25</option>
  <option>26</option>
  <option>27</option>
  <option>28</option>
  <option>29</option>
  <option>30</option>
  <option>31</option>
  </select>
  <select>
  <option selected>января</option></option>
  <option>февраля</option>
  <option>марта</option>
  <option>апреля</option>
  <option>мая</option>
  <option>июня</option>
  <option>июля</option>
  <option>августа</option>
  <option>сентября</option>
  <option>октября</option>
  <option>ноября</option>
  <option>декабря</option>
  </select>
  <input size="4"><br>
  <span>Установите окончание периода.</span><br>
  <select>
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
  <option>5</option>
  <option>6</option>
  <option>7</option>
  <option>8</optionb>
  <option>9</option>
  <option>10</option>
  <option>11</option>
  <option>12</option>
  <option>13</option>
  <option>14</option>
  <option>15</option>
  <option>16</option>
  <option>17</option>
  <option>18</option>
  <option>19</option>
  <option>20</option>
  <option>21</option>
  <option>22</option>
  <option>23</option>
  <option>24</option>
  <option>25</option>
  <option>26</option>
  <option>27</option>
  <option>28</option>
  <option>29</option>
  <option>30</option>
  <option selected>31</option>
  </select>
  <select>
  <option>января</option></option>
  <option>февраля</option>
  <option>марта</option>
  <option>апреля</option>
  <option>мая</option>
  <option>июня</option>
  <option>июля</option>
  <option>августа</option>
  <option>сентября</option>
  <option>октября</option>
  <option>ноября</option>
  <option selected>декабря</option>
  </select>
  <input size="4"><br><br>	
  <button>Найти</button>
  <button type="reset">Очистить введённые значения</button>
  </div>
  <div id="rezultat">
  display: none;
  </div>
  </body>
</html>

Цитата:

Сообщение от Блондинка

а можно чуть подробнее

Так вроде особо подробнее некуда... :-?
- Определяешь начальную дату
- Определяешь конечную дату
- Запускаешь цикл от начальной даты до конечной с шагом в 1 день
- В цикле проверяешь "очередную" дату на всякие свои совпадения

Блондинка, вот даже примеры с циклами "по дате"...
https://geekquestion.com/13547965-ka...v-formate-dmy/
Выбирай любой. ;)

первый вопрос, стоит ли для ввода начала и окончания периода использовать Выпадающие списки и поля ввода а потом проверять на коректность введённые даты? или лучше использовать input type date?

второй вопрос, как считать из элементов формы начальную и конечную даты?

Цитата:

Сообщение от Блондинка

стоит ли для ввода начала и окончания периода использовать Выпадающие списки и поля ввода а потом проверять на коректность введённые даты? или лучше использовать input type date?

Это уже решать тебе...
Некоторые "календарики" вешают на поля, это и является контролем.

Цитата:

Сообщение от Блондинка

как считать из элементов формы начальную и конечную даты?

Это либо одно поле... Либо комбинация неких полей дает в итоге данные для даты. Как строку преобразовать в тип "дата" написано в любом учебнике... ;)

нашла восемь псевдоэлементов

::-webkit-datetime-edit
::-webkit-datetime-edit-fields-wrapper
::-webkit-datetime-edit-text
::-webkit-datetime-edit-month-field
::-webkit-datetime-edit-day-field
::-webkit-datetime-edit-year-field
::-webkit-inner-spin-button
::-webkit-calendar-picker-indicator

кто нибудь может объяснить что даёт каждый из них?
надо избавиться от стрелки при клике на которую появляется сетка календаря...

насколько я поняла, надо использовать

<style>Input[type=date]::-webkit-calendar-picker-indicator { display: none;  }</style>
<input type="date">

или я не правильно поняла?

Цитата:

Сообщение от Блондинка

кто нибудь может объяснить что даёт каждый из них?

Это селекторы псевдоэлементов, отвечающих за различные части виджета. Названия говорят сами за себя.

Цитата:

Сообщение от Блондинка

надо избавиться от стрелки при клике на которую появляется сетка календаря...

Цитата:

Сообщение от Блондинка

я поняла

Цитата:

Сообщение от Блондинка

я не правильно поняла?

То, что вы сделали по прежнему позволяет менять дату. Если вы хотели, чтобы нельзя было менять дату, то используйте атрибут disabled...

<input type="date" disabled value="2020-08-04">

Если вы хотели, чтобы не было видно стрелки, но календарь всё-равно появлялся, то можно сделать так...

<style>
input[type="date"] {
    position: relative;
}

input[type="date"]::-webkit-calendar-picker-indicator {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
    height: auto;
}
</style>
<input type="date" value="2020-08-04">