这次做毕业设计遇到一个小小的问题,就是在添加员工信息时要填写出生年月,当然常规的做法是用下拉列表来做,年月日用三个下拉列表来做:
最开始的时候我想直接把给select添加option,比如月就直接添加12个option,日就直接添加31个option,不过后来发现不对劲,这样添加太麻烦啦,干嘛不用js来自动添加呢,其实这个也挺简单的嘛,o(︶︿︶)o 唉,看来还是没经验的表现啊,其实这样的东西应该第一感觉就是js嘛!赶紧做吧,其实这里用JS还可以让代码更健壮,不会出现BUG,因为如果像我开始那样做,会造成2月31这样不合常理的日期出现,而JS完全可以解决这些问题,废话少说代码贴出来啦!
<td height="40" align="right">出生年月:</td>
<td><select name="selectYear" id="selectYear" onChange="changeMonth()">
</select>
年
<select name="selectMonth" id="selectMonth" onChange="changeMonth()">
</select>
月
<select name="selectDay" id="selectDay">
</select>
日</td>
最开始的时候我想直接把给select添加option,比如月就直接添加12个option,日就直接添加31个option,不过后来发现不对劲,这样添加太麻烦啦,干嘛不用js来自动添加呢,其实这个也挺简单的嘛,o(︶︿︶)o 唉,看来还是没经验的表现啊,其实这样的东西应该第一感觉就是js嘛!赶紧做吧,其实这里用JS还可以让代码更健壮,不会出现BUG,因为如果像我开始那样做,会造成2月31这样不合常理的日期出现,而JS完全可以解决这些问题,废话少说代码贴出来啦!
var yearObj = null;
var monthObj = null;
var dayObj = null;
function showBirthDay() {
yearObj = document.tableForm.selectYear;
monthObj = document.tableForm.selectMonth;
dayObj = document.tableForm.selectDay;
//清空年份下拉列表的数据
yearObj.options.length = 0;
monthObj.options.length = 0;
dayObj.options.length = 0;
for(var i = 1900; i < 2012; i++) {
//$("<option value="+i+">"+i+"</option>").appendTo(yearObj);
var year = new Option(i,i);
yearObj.options.add(year);
}
for(var i = 1; i <= 12; i++) {
var month = new Option(i,i);
monthObj.options.add(month);
}
for(var i = 1; i <= 31; i++) {
var day = new Option(i,i);
dayObj.options.add(day);
}
}
//当月份改变时,日期也会随着改变。
function changeMonth() {
yearObj = document.tableForm.selectYear;
monthObj = document.tableForm.selectMonth;
dayObj = document.tableForm.selectDay;
dayObj.options.length = 0;
var month = monthObj.value;
var year = yearObj.value;
//如果是4,6,9,11月,就有30天
if(month == 4 || month == 6 || month == 9 || month == 11){
for(var i = 1; i <= 30; i++) {
var day = new Option(i,i);
dayObj.options.add(day);
}
}
//如果是2月,则
else if(month == 2) {
if((year%4==0 && year%100!=0) || year%400==0) {
for(var i = 1; i <= 29; i++) {
var day = new Option(i,i);
dayObj.options.add(day);
}
}else {
for(var i = 1; i <= 28; i++) {
var day = new Option(i,i);
dayObj.options.add(day);
}
}
}
//其他月份都是31天
else {
for(var i = 1; i <= 31; i++) {
var day = new Option(i,i);
dayObj.options.add(day);
}
}
}