|
как сделать?
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<form>
<button>></button>
<select id="month" name="month">
<option value="01">январь</option>
<option value="02">февраль</option>
<option value="03">март</option>
<option value="04">апрель</option>
<option value="05">май</option>
<option value="06">июнь</option>
<option value="07">июль</option>
<option value="08">август</option>
<option value="09">сентябрь</option>
<option value="10">октябрь</option>
<option value="11">ноябрь</option>
<option value="12">декабрь</option>
</select>
<button>></button>
<button><</button>
<input type="number" id="year" name="year" size="4" min="0" max="2250" step="1">
<button>></button>
</form>
<script>
var d = new Date();
document.addEventListener('DOMContentLoaded', function() {
document.querySelector('#month').options[d.getMonth()].selected = true;
document.querySelector('#year').value = d.getFullYear();
});
</script>
</body>
</html>
подскажите если не трудно, как сделать чтобы при клике на кнопки со стрелочками у опций переключился селектед, и содержимое поля ввода ввода менялось? |
Русский,
Изменить_месяц, сложно. const Изменить_месяц = вперёд => {
const
поле = document.getElementById("Месяц"),
выделено = поле.selectedIndex;
if (вперёд) {
if (выделено < 11) поле.selectedIndex++;
}
else {
if (выделено > 0) поле.selectedIndex--;
}
};
|
:) :write:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<form>
<input type=button onclick="Изменить_месяц(false);" value="<" />
<select id="Месяц" name="Месяц">
<option value="01">январь</option>
<option value="02">февраль</option>
<option value="03">март</option>
<option value="04">апрель</option>
<option value="05">май</option>
<option value="06">июнь</option>
<option value="07">июль</option>
<option value="08">август</option>
<option value="09">сентябрь</option>
<option value="10">октябрь</option>
<option value="11">ноябрь</option>
<option value="12">декабрь</option>
</select>
<input type=button onclick="Изменить_месяц(true);" value=">" />
<input type=button onclick="Изменить_год(false);" value="<" />
<input type=number size=4 min=0 max=2250 step=1 id="Год" name="Год" />
<input type=button onclick="Изменить_год(true);" value=">" />
</form>
<script>
const сегодня = new Date();
document.addEventListener('DOMContentLoaded', () => {
document.getElementById("Месяц").options[сегодня.getMonth()].selected = true;
document.getElementById("Год").value = сегодня.getFullYear();
});
const Изменить_месяц = вперёд => {
const поле = document.getElementById("Месяц");
let выделено = Math.max(1, Math.min(10,поле.selectedIndex));
вперёд ? выделено++ : выделено--
поле.selectedIndex = выделено
}
const Изменить_год = вперёд => {
const поле = document.getElementById("Год");
вперёд ? поле.value++ : поле.value--;
}
</script>
</body>
</html>
|
по идее в ваших двух примерах атрибут селектед должен быть установлен у опции с текущим месяцем и поле с годом заполнено, а отображается в селекте январь и поле пустое...
|
Цитата:
2. искать вариант перевода es6 в es5 или самостоятельно менять стрелочные функции на "обычные" и т.д.? |
babel es5 Try it out
Блондинка,
конвертор в es5 https://babeljs.io/repl Copy & Paste скопировать код es6, получить код es5, заменить одно на другое, добавить полифил перед кодом, если нужно. <script src="https://polyfill.io/v3/polyfill.min.js"></script> <!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<form>
<input type=button onclick="Изменить_месяц(false);" value="<" />
<select id="Месяц" name="Месяц">
<option value="01">январь</option>
<option value="02">февраль</option>
<option value="03">март</option>
<option value="04">апрель</option>
<option value="05">май</option>
<option value="06">июнь</option>
<option value="07">июль</option>
<option value="08">август</option>
<option value="09">сентябрь</option>
<option value="10">октябрь</option>
<option value="11">ноябрь</option>
<option value="12">декабрь</option>
</select>
<input type=button onclick="Изменить_месяц(true);" value=">" />
<input type=button onclick="Изменить_год(false);" value="<" />
<input type=number size=4 min=0 max=2250 step=1 id="Год" name="Год" />
<input type=button onclick="Изменить_год(true);" value=">" />
</form>
<script>
"use strict";
var сегодня = new Date();
document.addEventListener('DOMContentLoaded', function () {
document.getElementById("Месяц").options[сегодня.getMonth()].selected = true;
document.getElementById("Год").value = сегодня.getFullYear();
});
var Изменить_месяц = function Изменить_месяц(вперёд) {
var поле = document.getElementById("Месяц");
var выделено = Math.max(1, Math.min(10, поле.selectedIndex));
вперёд ? выделено++ : выделено--;
поле.selectedIndex = выделено;
};
var Изменить_год = function Изменить_год(вперёд) {
var поле = document.getElementById("Год");
вперёд ? поле.value++ : поле.value--;
};
</script>
</body>
</html>
|
рони,
спасибо большое, сейчас всё нормально работает |
кто знает как создать выпадающий список с одной опций для названия сегодн дня недели?
как создать выпадающий список для чисел месяца, что бы количество опций соответствовало количеству дней в месяце, (лишние опции скрыть) ? |
Цитата:
|
Как установить селектед соответствуещему дню недели понятно, а как убрать опции с другими днями недели?
другими словами при выборе даты день недели не играет никакой роли, можно было бы вывести на экран и текстом, но хотелось бы оставить список с одной опцией, чтобы внешне выглядело всё одинаково, все компоненты объекта дата были внутри элементов формы, селекты и инпуты а не просто текст |
| Часовой пояс GMT +3, время: 21:27. |
|