jQuery实现年月日三级联动
<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='/js/jquery.js'></script> <script type="text/javascript"> $(function () { var $day = $("#days"), $month = $("#month"), $year = $("#year"); //出始化年 var dDate = new Date(), dCurYear = dDate.getFullYear(), str = ""; for (var i = dCurYear; i < dCurYear + 2; i++) { if (i == dCurYear) { str = "<option value=" + i + " selected=true>" + i + "</option>"; } else { str = "<option value=" + i + ">" + i + "</option>"; } $year.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>"; } $month.append(str); } //调用函数出始化日 TUpdateCal($year.val(), $month.val()); $("#year,#month").bind("change", function(){ TUpdateCal($year.val(),$month.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), str = ""; $("#days").empty(); for (var 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>"; } $("#days").append(str); } } </script> </head> <body> <form name="ymd"> <select id="year"></select>年 <select id="month"></select>月 <select id="days"></select>日 </form> <input type="button" value="Get" id="get"/> <script type="text/javascript"> $("#get").click(function(){ alert($("#year").val()+"年"+$("#month").val()+"月"+$("#days").val()+"日"); }); </script> </body> </html>