js實現(xiàn)日期級聯(lián)效果
<div>
<select name="YYYY" onchange="YYYYMM(this.value)">
<option value="">請選擇 年</option>
</select>
<select name="MM" onchange="MMDD(this.value)">
<option value="">選擇 月</option>
</select>
<select name="DD">
<option value="">選擇 日</option>
</select>
</div>
<script language="JavaScript">
function window.onload() {
strYYYY = document.form1.YYYY.outerHTML;
strMM = document.form1.MM.outerHTML;
strDD = document.form1.DD.outerHTML;
MonHead = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
//先給年下拉框賦內(nèi)容
var y = new Date().getFullYear();
var str = strYYYY.substring(0, strYYYY.length - 9);
for (var i = (y - 30); i < (y + 30); i++) //以今年為準(zhǔn)，前30年，后30年
{
str += "<option value='" + i + "'> " + i + " 年" + "</option>\r\n";
}
document.form1.YYYY.outerHTML = str + "</select>";
//賦月份的下拉框
var str = strMM.substring(0, strMM.length - 9);
for (var i = 1; i < 13; i++) {
str += "<option value='" + i + "'> " + i + " 月" + "</option>\r\n";
}
document.form1.MM.outerHTML = str + "</select>";
document.form1.YYYY.value = y;
document.form1.MM.value = new Date().getMonth() + 1;
var n = MonHead[new Date().getMonth()];
if (new Date().getMonth() == 1 && IsPinYear(YYYYvalue)) n++;
writeDay(n); //賦日期下拉框
document.form1.DD.value = new Date().getDate();
}
function YYYYMM(str) //年發(fā)生變化時日期發(fā)生變化(主要是判斷閏平年)
{
var MMvalue = document.form1.MM.options[document.form1.MM.selectedIndex].value;
if (MMvalue == "") { DD.outerHTML = strDD; return; }
var n = MonHead[MMvalue - 1];
if (MMvalue == 2 && IsPinYear(str)) n++;
writeDay(n)
}
function MMDD(str) //月發(fā)生變化時日期聯(lián)動
{
var YYYYvalue = document.form1.YYYY.options[document.form1.YYYY.selectedIndex].value;
if (str == "") { DD.outerHTML = strDD; return; }
var n = MonHead[str - 1];
if (str == 2 && IsPinYear(YYYYvalue)) n++;
writeDay(n)
}
function writeDay(n) //據(jù)條件寫日期的下拉框
{
var s = strDD.substring(0, strDD.length - 9);
for (var i = 1; i < (n + 1); i++)
s += "<option value='" + i + "'> " + i + " 日" + "</option>\r\n";
document.form1.DD.outerHTML = s + "</select>";
}
function IsPinYear(year)//判斷是否閏平年
{
return (0 == year % 4 && (year % 100 != 0 || year % 400 == 0))
}
相關(guān)文章
本文給大家淺析javascript調(diào)試方法和技巧，涉及到j(luò)avascript調(diào)試方法和技巧方面的知識，本文介紹的非常詳細(xì)，非常具有參考借鑒介紹，感興趣的朋友一起看看吧2015-10-10
bootstrap+jQuery實現(xiàn)的動態(tài)進(jìn)度條功能示例
這篇文章主要介紹了bootstrap+jQuery實現(xiàn)的動態(tài)進(jìn)度條功能,結(jié)合完整實例形式分析了bootstrap+jQuery實現(xiàn)動態(tài)進(jìn)度條的具體步驟與相關(guān)操作技巧,需要的朋友可以參考下2017-05-05
這篇文章主要為大家詳細(xì)介紹了JS組件Bootstrap Table使用方法，具有一定的實用性和參考價值，感興趣的小伙伴們可以參考一下2016-10-10
今天小編就為大家分享一篇Layui多選只有最后一個值的解決方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
這篇文章主要介紹了JS精確判斷數(shù)據(jù)類型代碼實例,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-12-12
伸縮的菜單，想必大家都有見到過吧，實現(xiàn)方法也是很多的，在接下來的文章中為大家介紹下使用js是如何實現(xiàn)的，需要的朋友可以參考下2013-12-12
今天小編就為大家分享一篇解決eclipse中沒有js代碼提示的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-10-10
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)點擊效果，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-06-06
這篇文章主要介紹了JS數(shù)組方法push()、pop()用法,結(jié)合實例形式分析了JavaScript數(shù)組push()與pop()方法基本功能、原理、使用方法與操作注意事項,需要的朋友可以參考下2020-01-01
這篇文章主要介紹了JavaScript實現(xiàn)模仿桌面窗口的方法,可實現(xiàn)模仿桌面窗口的打開、關(guān)閉、移動、縮放及最大化、最小化等功能,需要的朋友可以參考下2015-07-07