javascript 日期联动选择器 [其中的一些代码值得学习]

<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title> dateselector </title> <style> body { margin: 0px; padding: 0px; font-size: 12px; } #year, #month, #date{ width: 60px; margin-right: 3px; } </style> <select id="year"></select><select id="month"></select><select id="date"></select><span id="info"></span>
[ctrl+a 全选 注:如需引入外部js需刷新才能执行]

[参数说明]

var dateselector = new dateselector(年下拉id, 月下拉id, 日下拉id, {flooryear: 向前几年, ceilyear: 向后几年});
dateselector.onstart = dateselector.onend = function(){ // 自定义开始结束事件
$('info').innerhtml = this.getseltext(this.year) + '年' +
('0' + this.getseltext(this.month)).slice(-2) + '月' +
('0' + this.getseltext(this.date)).slice(-2) + '日';
}
dateselector.init(); // 初始化开始

[说明文字]

这里生成option的方法选择了中规中矩的options[i].text = options[i].value = i;

期间用过一个这个方法:

container.options[container.options.length] = new option(i, i, false, (i == sign ? true : false))
这个new option有4个参数可用(text, value, defaultselected, selected); 最后一个参数可以设置选中.

但一直没有查到官方资料. 在ie6中也遇到了bug.大家有用过的请指正.

bug演示

这个在ie7,ie8,ff3等都没问题.但在ie6就会选中的是前一个.现在还未知原因. (经过确认好像是ie tester的问题.那么下面这个方案也是个简洁的生成option方案)


测试代码:

<select id="year"></select>
<script type="text/javascript">
<!--
var osel = document.getelementbyid('year');
var sign = 2008;
for(var i = 2001; i < 2010; i++) {
osel.options[osel.options.length] = new option(i, i, false, (i == sign ? true : false));
}
//-->
</script>