手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >js日期联动示例
js日期联动示例
摘要:调试需加入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>日

【js日期联动示例】相关文章:

jquery实现弹出层效果实例

IE中jscript/javascript的条件编译

js比较日期大小的方法

jQuery聚合函数实例

静态的动态续篇之来点XML

自动设为主页

JS实现1000以内被3或5整除的数字之和

js选择日期

js实现简单锁屏功能实例

日期函数扩展类Ver0.1.1

精品推荐
分类导航