基于Asp.net与Javascript控制的日期控件


Posted in Javascript onMay 22, 2010

控件效果如下:

基于Asp.net与Javascript控制的日期控件

从左到右:month,day,year

.cs文件初始化这三个下拉列表

private void BindBirthDay(int day, int month, int year) 
{ 
int dayNow = day; 
int monNow = month; 
int yearNow = year; 
//binding Month 
for (int i = 1; i <= 12; i++) 
{ 
ddlBirMon.Items.Add(new ListItem(i.ToString(), i.ToString())); 
} 
ddlBirMon.Items[monNow - 1].Selected = true; 
//binding Day 
int daysOfMonth = DateTime.DaysInMonth(yearNow, monNow); 
for (int i = 1; i <= daysOfMonth; i++) 
{ 
ddlBirDay.Items.Add(new ListItem(i.ToString(), i.ToString())); 
} 
ddlBirDay.Items[dayNow - 1].Selected = true; 
//binding Year 
for (int i = 20; i > 0; i--) 
{ 
ddlBirYear.Items.Add(new ListItem((yearNow - i).ToString(), (yearNow - i).ToString())); 
} 
for (int i = 0; i < 20; i++) 
{ 
ddlBirYear.Items.Add(new ListItem((yearNow + i).ToString(), (yearNow + i).ToString())); 
} 
ddlBirYear.Items.FindByValue(yearNow.ToString()).Selected = true; 
}

js代码如下(自己写的,不保证完全正确啊):
function ChangeDay() { 
var month = document.getElementById("<%=ddlBirMon.ClientID %>"); 
var year = document.getElementById("<%=ddlBirYear.ClientID %>"); 
var day = document.getElementById("<%=ddlBirDay.ClientID %>"); 
if (month.selectedIndex == 3 || month.selectedIndex == 5 || month.selectedIndex == 8 || month.selectedIndex == 10) { 
if (day.length == 31) { 
if (day.options[30].selected == true) { 
day.options[29].selected = true; 
} 
day.remove(30); 
} 
} 
else{ 
while (day.length < 31) { 
day.add(new Option(day.length+1,day.length+1)); 
} 
} 
if (month.selectedIndex == 1) { 
if (day.length > 28) { 
if (day.selectedIndex == 28) { 
day.options[27].selected = true; 
} 
while (day.length > 28) { 
day.remove(day.length - 1); 
} 
} 
var sy = year.options[year.selectedIndex].value; 
if ((sy % 4 == 0 && sy % 100 != 0) || (sy % 400==0)) { 
day.add(new Option("29", "29")); 
} 
} 
}
Javascript 相关文章推荐
输入框的字数时时统计—关于 onpropertychange 和 oninput 使用
Oct 21 Javascript
JavaScript对数组进行随机重排的方法
Jul 22 Javascript
Ubuntu系统下Angularjs开发环境安装
Sep 01 Javascript
vue组件中点击按钮后修改输入框的状态实例代码
Apr 14 Javascript
微信小程序中hidden不生效原因的解决办法
Apr 26 Javascript
vue实现动态数据绑定
Apr 28 Javascript
详解VueJs前后端分离跨域问题
May 24 Javascript
JavaScript初学者必看“new”
Jun 12 Javascript
ES6深入理解之“let”能替代”var“吗?
Jun 28 Javascript
Javascript防止图片拉伸的自适应处理方法
Dec 26 Javascript
JS实现查找数组中对象的属性值是否存在示例
May 24 Javascript
一看就会的vuex实现登录验证(附案例)
Jan 09 Javascript
jQueryPad 实用的jQuery测试工具(支持IE,chrome,FF)
May 22 #Javascript
用jQuery打造TabPanel效果代码
May 22 #Javascript
Mootools 图片展示插件(lightbox,ImageMenu)收集集合
May 21 #Javascript
jquery 多级下拉菜单核心代码
May 21 #Javascript
JQuery 学习技巧总结
May 21 #Javascript
Jquery调用webService远程访问出错的解决方法
May 21 #Javascript
ExtJS 下拉多选框lovcombo
May 19 #Javascript
You might like
yii实现图片上传及缩略图生成的方法
2014/12/04 PHP
了解jQuery技巧来提高你的代码
2010/01/08 Javascript
给jqGrid数据行添加修改和删除操作链接(之一)
2011/11/04 Javascript
JavaScript面向对象程序设计三 原型模式(上)
2011/12/21 Javascript
Javascript连接多个数组不用concat来解决
2014/03/24 Javascript
JavaScript设计模式之原型模式(Object.create与prototype)介绍
2014/12/28 Javascript
jQuery中add()方法用法实例
2015/01/08 Javascript
jQuery实现简单的间隔向上滚动效果
2015/03/09 Javascript
基于JavaScript实现Json数据根据某个字段进行排序
2015/11/24 Javascript
jquery分页插件jquery.pagination.js实现无刷新分页
2016/04/01 Javascript
angularJS 发起$http.post和$http.get请求的实现方法
2017/05/18 Javascript
jquery动态添加带有样式的HTML标签元素方法
2018/02/24 jQuery
详解webpack import()动态加载模块踩坑
2018/07/17 Javascript
使用Nuxt.js改造已有项目的方法
2018/08/07 Javascript
checkbox在vue中的用法小结
2018/11/13 Javascript
WEEX环境搭建与入门详解
2019/10/16 Javascript
Vue修改项目启动端口号方法
2019/11/07 Javascript
深入解析Python中的WSGI接口
2015/05/11 Python
Python实现的求解最小公倍数算法示例
2018/05/03 Python
使用tensorflow实现线性回归
2018/09/08 Python
Django如何自定义分页
2018/09/25 Python
python读取几个G的csv文件方法
2019/01/07 Python
python 怎样将dataframe中的字符串日期转化为日期的方法
2019/09/26 Python
Win10用vscode打开anaconda环境中的python出错问题的解决
2020/05/25 Python
python opencv 实现读取、显示、写入图像的方法
2020/06/08 Python
基于注解实现 SpringBoot 接口防刷的方法
2021/03/02 Python
高清屏中使用Canvas绘图出现模糊的问题及解决方法
2019/06/03 HTML / CSS
Fashion Eyewear美国:英国线上设计师眼镜和太阳镜的零售商
2016/08/15 全球购物
加拿大花店:1800Flowers.ca
2016/11/16 全球购物
DNA测试:Orig3n
2019/03/01 全球购物
法务专员岗位职责
2014/01/02 职场文书
2014年师德师风学习材料
2014/05/16 职场文书
三年级学生评语大全
2014/12/26 职场文书
2016新年慰问信范文
2015/03/25 职场文书
图文详解nginx日志切割的实现
2022/01/18 Servers
golang操作rocketmq的示例代码
2022/04/06 Golang