Js date linkage example

2020-03-30 02:49:33
OfStack
Debugging requires adding jquery files
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<script src="jquery.js"></script> 
<script> 
$(function(){ 
$('#year').change(function(){ 
if (ifLeapYear($(this).val())) 
{ 
if ($('#month').val() == 2 && $('#day').children().length == 29) 
{ 
$('#day').append('<option value="29">29</option>'); 
} 
} else 
{ 
if ($('#month').val() == 2 && $('#day').children().length == 30) 
{ 
$('#day :last-child').remove(); 
} 
} 
}); 

$('#month').change(function(){ 
var thisValue = $(this).val(); 
var dayValue = $('#day').val(); 
var month1 = ['4','6','9','11']; 
$('#day').html('<option value="">- Please select a -</option>'); 
var day = ''; 
if (thisValue == '') 
{ 
return false; 
} 
if ($.inArray(thisValue, month1) != -1) 
{ 
day = setDay(30); 
$('#day').append(day); 
} else if ($(this).val() == '2') 
{ 
if ($('#year').val() != '' && ifLeapYear($('#year').val())) 
{ 
day = setDay(29); 
} else 
{ 
day = setDay(28); 
} 
$('#day').append(day); 
} else 
{ 
day = setDay(31); 
$('#day').append(day); 
} 
$('#day').find('option[value='+dayValue+']').attr('selected',true); 
}); 
}) 
function setDay(day) 
{ 
var dayInfo = ''; 
for (var i=1; i<=day; i++) 
{ 
dayInfo += '<option value="' + i +'">' + i+ '</option>'; 
} 
return dayInfo; 
} 
function ifLeapYear(year) 
{ 
if ((year % 4 == 0 && year % 100 != 0) || year % 400 == 0) 
{ 
return true; 
} else 
{ 
return false; 
} 
} 
</script> 
<select id="year"><option value="">- Please select a -</option> 
<?php for ($i=1980;$i<2012;$i++){ ?> 
<option value="<?php echo $i ?>"><?php echo $i ?></option> 
<?php } ?> 
</select> years  
<select id="month"><option value="">- Please select a -</option> 
<?php for ($i=1;$i<=12;$i++){ ?> 
<option value="<?php echo $i ?>"><?php echo $i ?></option> 
<?php } ?> 
</select> month  
<select id="day"><option value="">- Please select a -</option></select> day