jquery 年月日三级联动

本秂侑毒 提交于 2020-04-01 04:33:51

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>

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!