JS實(shí)現(xiàn)年份加減函數(shù)

2012/11/5 19:11:48作者：佚名來(lái)源：網(wǎng)絡(luò)

移動(dòng)端

【實(shí)例名稱】

【實(shí)例描述】

年份加減功能經(jīng)常出現(xiàn)在財(cái)務(wù)軟件中：本例使用JavaScript實(shí)現(xiàn)年份加減函數(shù)，可在網(wǎng)頁(yè)中直接調(diào)用。

【實(shí)例代碼】

<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
    var d=new Date()    //獲取當(dāng)天日期
    document.write("<select id=selyear>");  
//輸出一個(gè)下拉框
    var int;
    int=new Array()                         
//創(chuàng)建數(shù)組
    for(i=2003;i<2013;i++){                 
//依次添加年份到數(shù)組
    int[i]=i;
    document.write("<option "+((d.getYear()==i)?"selected":"")
+" value=" + int[i] + ">" + int[i] + "</option>");
    }
    document.write("</select>年");
    //實(shí)現(xiàn)年份加減的方法
    function DateAdd(n){
        var dlt = document.getElementById("selyear");   
//獲取年份下拉框
        var len = dlt.options.length;                   
//獲取有多少個(gè)年份
        var idx = dlt.selectedIndex  - n ;              
//年份的索引
        dlt.selectedIndex = idx < 0? 0 : 
(idx > len-1 ? len-1 : idx); //選定年份
}
</SCRIPT>
<title>無(wú)標(biāo)題-學(xué)無(wú)憂（yzddtk.cn）</title>
</head>
<body>
<form name="form1" method="post" action="">
 <input type="button" id="YearPre" name="YearPre" 
value="上一年" class="button" onclick="DateAdd(1);" />
<input type="button" id="YearNext" name="YearNext" 
value="下一年" class="button" onclick="DateAdd(-1);" />
</form>
</body>
</html>

【運(yùn)行效果】

年份加減函數(shù)運(yùn)行效果

【難點(diǎn)剖析】

本例的重點(diǎn)是如何將年份動(dòng)態(tài)添加到下拉框中，并指定當(dāng)前年份。默認(rèn)選中的年份是當(dāng)前年份。通過(guò)一個(gè)循環(huán)往下拉框中添加“option”項(xiàng)，然后通過(guò)“dlt．selectedlndex．n”獲取指定索引處的年份，參數(shù)“n”可以是正值，也可以是負(fù)值。

【源碼下載】

為了JS代碼的準(zhǔn)確性，請(qǐng)點(diǎn)擊：年份加減函數(shù) 進(jìn)行本實(shí)例源碼下載

標(biāo)簽： JS實(shí)現(xiàn) 日期