级联的html生成,jQuery实现动态生成年月日级联下拉列表示例

本文实例讲述了jQuery实现动态生成年月日级联下拉列表。分享给大家供大家参考，具体如下：

html代码：

年

月

日

JS代码：

$(function(){

var i=1945;

var date=new Date();

var year=date.getFullYear();//获取当前年份

var dropList;

for(var i;i<2017;i++){

if(i==year){

dropList=dropList+""+i+"";

}else {

dropList=dropList+""+i+"";

}

}

$('#dateForm select[name=year]').html(dropList);//生成年份下拉列表

var monthly;

for(var j=1;j<13;j++){

monthly=monthly+''+j+''

}

$('#dateForm select[name=month]').html(monthly);//生成月份下拉列表

var daily;

for(var day=1;day<=31;day++){

daily=daily+''+day+'';

}

$('#dateForm select[name=day]').html(daily);

$('#dateForm select[name=month]').change(function(){

var currentDay;

var total;

var flag=$('#dateForm select[name=year]:selected').val();

var currentMonth=$('#dateForm select[name=month]').val();

switch (currentMonth){

case "1":

case "3":

case "5":

case "7":

case "8":

case "10":

case "12":total=31;break;

case "4":

case "6":

case "9":

case "11":total=30;break;

case "2":

//闰年 整除4但是不整除100 或者整除400

if( (flag%4==0 && flag%100!=0 ) || flag%400){

total=29;

}else {

total=28;

}

default :break

}

for(day=1;day<=total;day++){

currentDay=currentDay+''+day+''

}

$('#dateForm select[name=day]').html(currentDay);//生成日期下拉列表

});

});

PS：这里再为大家推荐几款时间及日期相关工具供大家参考使用：

希望本文所述对大家jQuery程序设计有所帮助。