实现一个年、月、季度联动SELECT的javascript代码

您现在的位置：蓝派网 >> 文章中心 >> 网页制作 >> JavaScript >> 正文

站内文章搜索:

实现一个年、月、季度联动SELECT的javascript代码

作者：佚名文章来源：网络更新时间：2008-8-10 18:25:30

<body>
<table border=0 height=30px >
<tr>
<td width=80px>
<select onchange="displaySubmenu(this.value)">
<option value="none">请选择报告类型</option>
<option value="1,4">月度报告</option>
<option value="1,3">季度报告</option>
<option value="1,2">半年报告</option>
<option value="1">年度报告</option>
</select>
</td>
<td>
<select id="submenu_1" name="year" style="display:none;"></select>
</td>
<td>
<select id="submenu_2" name="semiyear" style="display:none;"></select>

<select id="submenu_3" name="quarter" style="display:none;"></select>

<select id="submenu_4" name="month" style="display:none;"></select>
</td>
<td>
<input id="ok" type="button" onClick='GetValue();' value="取值">
</td>
</tr>

</table>

<script>
function GetValue(){
    var objlist = document.getElementsByTagName("SELECT");
    var tmp = new Array();
    var tap = objlist[0].options[objlist[0].selectedIndex].text;
    strTmp="";
    var j = 1;
    for(var i=1;i<objlist.length;i++){
        if(objlist[i].style.display!="none"){
            strTmp += objlist[i].options[objlist[i].selectedIndex].text + "-";
            j++;
        }
    }
    strTmp = strTmp.substring(0,strTmp.length-1);
    alert(tap);
    alert(strTmp);

}

function hideAll(){
for(i=1;i<5;i++){
var select = document.getElementById("submenu_"+i);
while(select.options.length>0){
select.options.remove(0);
}
select.style.display = "none";
}
}

function initSelect(index){
var select = document.getElementById("submenu_"+index);
var now = new Date();
var currentYear = now.getYear();
var month = now.getMonth();
switch(index){
case 1:
for(i=-5;i<=5;i++){
var value = currentYear+i;
var item = new Option(value,value);
select.options.add(item);
}
select.selectedIndex = 5;
select.style.display = "block";
break;
case 2:
var semiyears = new Array("上半年","下半年");
for(i=0;i<2;i++){
var item = new Option(semiyears[i],i+1);
select.add(item);
}
select.selectedIndex = Math.floor(month/6);
select.style.display = "block";
break;
case 3:
var quarters = new Array("一季度","二季度","三季度","四季度");
for(i=0;i<4;i++){
var item = new Option(quarters[i],i+1);
select.add(item);
}
select.selectedIndex = Math.floor(month/3);
select.style.display = "block";
break;
case 4:
var months = new Array("一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月");
for(i=0;i<12;i++){
var item = new Option(months[i],i+1);
select.add(item);
}
select.selectedIndex = month;
select.style.display = "block";
break;
default:
break;
}
}

function displaySubmenu(command){
hideAll();
if(command != "none"){
var commands = command.split(",");
for(l=0;l<commands.length;l++){
initSelect(parseInt(commands[l]));
}
}
}
</script>
</body>

上一篇文章：超级实用且不花哨的js代码大全

下一篇文章： JavaScript日期大全-农历时间显示

百度搜索： 实现一个年、月、季度联动SELECT的javascript代码

【发表评论】【打印此文】【关闭窗口】【点击数：】

★好玩的休闲小游戏★

网友评论：

数据载入中，请稍后……

实现一个年、月、季度联动SELECT的javascript代码

本栏推荐

本栏热门

站内推荐

图文推荐

实现一个年、月、季度联动SELECT的javascript代码

本 栏 推 荐

本 栏 热 门

站 内 推 荐

图 文 推 荐

本栏推荐

本栏热门

站内推荐

图文推荐