js日期联动示例
js日期联动示例
发布时间:2016-12-30 来源:查字典编辑
摘要:调试需加入jquery文件复制代码代码如下:$(function(){$('#year').change(function(){if(ifL...

调试需加入jquery文件

复制代码 代码如下:

<!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="">-请选择-</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="">-请选择-</option>

<?php for ($i=1980;$i<2012;$i++){ ?>

<option value="<?php echo $i ?>"><?php echo $i ?></option>

<?php } ?>

</select>年

<select id="month"><option value="">-请选择-</option>

<?php for ($i=1;$i<=12;$i++){ ?>

<option value="<?php echo $i ?>"><?php echo $i ?></option>

<?php } ?>

</select>月

<select id="day"><option value="">-请选择-</option></select>日

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类