您的位置：首页 > Web前端 > JQuery

jquery 年月日三级联动

2011-12-26 16:42 232 查看

JS里面的new Date("xxxx/xx/xx")这个日期的构造方法有一个妙处，

当你传入的是"xxxx/xx/0"（0号）的话，得到的日期是"xx"月的前一个月的最后一天（"xx"月的最大取值是69，题外话），

当你传入的是"xxxx/xx/1"（1号）的话，得到的日期是"xx"月的后一个月的第一天（自己理解）

如果传入"1999/13/0"，会得到"1998/12/31"。而且最大的好处是当你传入"xxxx/3/0"，会得到xxxx年2月的最后一天，它会自动判断当年是否是闰年来返回28或29，不用自己判断，

所以，我们想得到选择年选择月有多少天的话，只需要

var temp=new Date("选择年/选择月+1/0");

return temp.getDate()//最大天数

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>JQuery实例 - 生成年月日</title>
<meta http-equiv="content-type" content="text/html; charset=gbk">
<script type="text/javascript" src="jquery-1.3.1.js"></script>
<script type="text/javascript">

$(document).ready(function(){
var $day1 = $("#day1");
var $month1 = $("#month1");
var $year1 = $("#year1");

var dDate = new Date();
var dCurYear = dDate.getFullYear();
var str="";
for(var i=dCurYear-20;i<dCurYear+1;i++)
{
if(i==dCurYear){
str="<option value="+i+" selected=true>"+i+"</option>";
}else{
str="<option value="+i+">"+i+"</option>";
}
$year1.append(str);
}


for(var i=1;i<=12;i++){

if(i==(dDate.getMonth()+1))
{
str="<option value="+i+" selected=true>"+i+"</option>";
}else{
str="<option value="+i+">"+i+"</option>";
}
$month1.append(str);
}

TUpdateCal($("#year1").val(),$("#month1").val());
});


function TGetDaysInMonth(iMonth, iYear) {
var dPrevDate = new Date(iYear, iMonth, 0);
return dPrevDate.getDate();
}

function TUpdateCal(iYear, iMonth) {
var dDate=new Date();
daysInMonth = TGetDaysInMonth(iMonth, iYear);
$("#day1").empty();
for (d = 1; d <= parseInt(daysInMonth); d++) {

if(d==dDate.getDate()){
str="<option value="+d+" selected=true>"+d+"</option>";
}else{
str="<option value="+d+">"+d+"</option>";
}
$("#day1").append(str);
}
}

</script>

</head>
<body>
<form name="ymd">
<select id="year1" onchange="TUpdateCal(ymd.year1.value,ymd.month1.value)">

</select>年
<select id="month1" onchange="TUpdateCal(ymd.year1.value,ymd.month1.value)" >

</select>月
<select id="day1">

</select>日
</form>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航