Code
CSS
select{
background-color:#FFFFFF;
border:2px solid #cccccc;
font-size:18px;
margin:10px;
}
HTML
<select id="year" onChange="dayDate()">
<option value="2024">2024</option>
<!-- Complete list of years -->
</select>
<select id="month" onChange="dayDate()">
<option value="1">January</option>
<!-- Complete list of month -->
</select>
<select id="day" onChange="dayDate()">
</select>
Javascript
function dayDate(){
var
year =
document.
querySelector(
"#year").value
var
month =
document.
querySelector(
"#month").value
var
selectDays =
document.
querySelector(
"#day")
selectDays.style.borderColor=
""
var
daySelected =
selectDays.value
selectDays.innerHTML =
""
var
daysMonth =
new Date(
year,
month, 0).
getDate()
for (var
i = 1 ;
i <=
daysMonth ;
i++){
var opt = document.createElement("option");
opt.value = i
opt.innerHTML = i
if (daySelected == i) opt.selected = true
selectDays.appendChild(opt);
}
if (
daySelected >
daysMonth){
selectDays.style.borderColor = "red"
opt.selected=true
}
}
document.addEventListener('DOMContentLoaded', function() {
dayDate()
}, false)
If you want, edit the text in red
Annex: Name of days and months
Català
Dilluns ; Dimarts ; Dimecres ; Dijous ; Divendres ; Dissabte ; Diumenge
Gener ; Febrer ; Març ; Abril ; Maig ; Juny ; Juliol ; Agost ; Setembre ; Octubre ; Novembre ; Desembre
Deutsch
Montag ; Dienstag ; Mittwoch ; Donnerstag ; Freitag ; Samstag ; Sonntag
Januar ; Februar ; März ; April ; Mai ; Juni ; Juli ; August ; September ; Oktober ; November ; Dezember
English
Monday ; Tuesday ; Wednesday ; Thursday ; Friday ; Saturday ; Sunday
January ; February ; March ; April ; May ; June ; July ; August ; September ; October ; November ; December
Español
Lunes ; Martes ; Miércoles ; Jueves ; Viernes ; Sábado ; Domingo
Enero ; Febrero ; Marzo ; Abril ; Mayo ; Junio ; Julio ; Agosto ; Septiembre ; Octubre ; Noviembre ; Diciembre
Française
Lundi ; Mardi ; Mercredi ; Jeudi ; Vendredi ; Samedi ; Dimanche
Janvier ; Février ; Mars ; Avril ; Mai ; Juin ; Juillet ; Août ; Septembre ; Octobre ; Novembre ; Décembre
Italiano
Lunedi ; Martedì ; Mercoledì ; Giovedi ; Venerdì ; Sabato ; Domenica
Gennaio ; Febbraio ; Marzo ; Aprile ; può ; Giugno ; Luglio ; Agosto ; Settembre ; Ottobre ; Novembre ; December
Polski
Poniedziałek ; Wtorek ; Środa ; Czwartek ; Piątek ; Sobota ; Niedziela
Styczeń ; Luty ; Marzec ; Kwiecień ; Maj ; Czerwiec ; Lipiec ; Sierpień ; Wrzesień ; Październik ; Listopad ; Grudzień
Português
segunda-feira ; terça-feira ; quarta-feira ; quinta-feira ; sexta-feira ; sábado ; domingo
Janeiro ; Fevereiro ; Março ; Abril ; Maio ; Junho ; Julho ; Agosto ; Setembro ; Outubro ; Novembro ; Dezembro
русский
Понедельник ; Вторник ; Среда ; Четверг ; Пятница ; Суббота ; Воскресенье
Январь ; Февраль ; Марта ; Апрель ; Май ; Июнь ; Июль ; Август ; Сентябрь ; Октябрь ; ноябрь ; Декабрь
中国
星期一 ; 星期二 ; 星期三 ; 星期四 ; 星期五 ; 星期六 ; 星期天
一月 ; 二月 ; 三月 ; 四月 ; 五月 ; 六月 ; 七月 ; 八月 ; 九月 ; 十月 ; 十一月 ; 十二月