不错的一个日期输入 动态


Posted in Javascript onNovember 06, 2006
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>日期控件</title> 
<script> 
var agt = navigator.userAgent.toLowerCase(); 
var OldTextBox; 
function DateSeter(obj){ 
    var parent=obj.parentNode;     var selYear=document.createElement('SELECT'); 
    selYear.id='LoftyYear'; 
    parent.insertBefore(selYear,obj); 
    var selMonth=document.createElement('SELECT'); 
    selMonth.id='LoftyMonth'; 
    parent.insertBefore(selMonth,obj); 
    var selDay=document.createElement('SELECT'); 
    selDay.id='LoftyDay'; 
    parent.insertBefore(selDay,obj); 
    var btnSubmit=document.createElement('BUTTON'); 
    btnSubmit.style.width='22px'; 
    parent.insertBefore(btnSubmit,obj); 
    btnSubmit.id='LoftyBtn'; 
    for(s in btnSubmit) 
    { 
//document.write(s+'<br />'); 
    } 
    btnSubmit.textContent='OK'; 
    btnSubmit.value='OK'; 
    al(btnSubmit,'click','Restore()'); 
    OldTextBox=obj; 
    parent.removeChild(obj); 
    var now=new Date(); 
    var cYear=now.getFullYear(); 
    SetCurrentYear(selYear,cYear); 
    al(selYear,'change','SetCurrentYear(document.getElementById(\'LoftyYear\'))'); 
    al(selMonth,'change','SetDay(null,null)'); 
    for(i=1;i<=12;i++) 
    { 
        var op=new Option(i,i); 
        selMonth.options.add(op); 
    } 
    var cMonth=now.getMonth()+1; 
    SetDay(cYear,cMonth); 
    selDay.selectedIndex=now.getDate()-1; 
} 
function Restore() 
{ 
    var yy=document.getElementById('LoftyYear'); 
    var mm=document.getElementById('LoftyMonth'); 
    var d=document.getElementById('LoftyDay'); 
    var btn=document.getElementById('LoftyBtn'); 
    var time=yy.options[yy.selectedIndex].value+'-'+mm.options[mm.selectedIndex].value+'-'+d.options[d.selectedIndex].value; 
    OldTextBox.value=time; 
    var parent=yy.parentNode; 
    parent.insertBefore(OldTextBox,yy); 
    parent.removeChild(yy); 
    parent.removeChild(mm); 
    parent.removeChild(d); 
    parent.removeChild(btn); 
} 
function SetDay(year,month) 
{ 
    if(year==null){ 
        var yy=document.getElementById('LoftyYear'); 
        var mm=document.getElementById('LoftyMonth'); 
        year=Math.round(yy.options[yy.selectedIndex].value); 
        month=Math.round(mm.options[mm.selectedIndex].value); 
    } 
    var date=new Date(year,month,1); 
    date.setDate(0); 
    var maxdate=date.getDate(); 
    var obj=document.getElementById('LoftyDay'); 
    var seldate=obj.selectedIndex; 
    if(obj.options.length>0){ 
        if(Math.round(obj.options[obj.selectedIndex].value)>maxdate) 
        { 
            seldate=maxdate-1; 
        } 
    } 
        reAppendSelect(obj,1,maxdate,seldate+1); 
} 
function SetCurrentYear(selecter,currYear) 
{ 
    if(currYear==null){ 
        currYear=Math.round(selecter.options[selecter.selectedIndex].value); 
    } 
    reAppendSelect(selecter,currYear-10,currYear+10,currYear); 
} 
function reAppendSelect(selecter,startIndex,endIndex,selIndex) 
{ 
    while(selecter.options.length>0) 
    { 
        selecter.removeChild(selecter.options[selecter.options.length-1]); 
    } 
    for(i=startIndex;i<=endIndex;i++) 
    { 
        var op=new Option(i,i); 
        selecter.options.add(op); 
        op.selected=(selIndex==i); 
    } 
} 
function al(obj,lissener,func){ 
    if(agt.indexOf('firefox')!=-1){ 
        obj.addEventListener(lissener,function(){eval(func);},false); 
    }else{ 
        obj.attachEvent('on'+lissener,function(){eval(func);}); 
    } 
} 
</script> 
</head> 
<body> 
<input onclick="DateSeter(this);" /> 
</body> 
</html>

精简只有年:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>日期控件</title> 
<script> 
var agt = navigator.userAgent.toLowerCase(); 
var OldTextBox; 
function DateSeter(obj){ 
    var parent=obj.parentNode; 
    var selYear=document.createElement('SELECT'); 
    selYear.id='LoftyYear'; 
    parent.insertBefore(selYear,obj); 
/* 
    var btnSubmit=document.createElement('BUTTON'); 
    btnSubmit.style.width='32px'; 
    parent.insertBefore(btnSubmit,obj); 
    btnSubmit.id='LoftyBtn'; 
    btnSubmit.textContent='OK'; 
    btnSubmit.value='OK'; 
    al(btnSubmit,'click','Restore()'); 
*/     
    OldTextBox=obj; 
    parent.removeChild(obj); 
    var defaultValue = obj.value; 
    var now=new Date(); 
    var cYear=now.getFullYear(); 
    SetCurrentYear(selYear,cYear,defaultValue); 
    al(selYear,'change','Restore(obj)'); 
} 
function Restore() 
{ 
OldTextBox.value = arguments[0].value; 
var yy=document.getElementById('LoftyYear'); 
var parent=yy.parentNode; 
parent.insertBefore(OldTextBox,yy); 
parent.removeChild(yy); 
/* 
    var yy=document.getElementById('LoftyYear'); 
    var btn=document.getElementById('LoftyBtn'); 
    var time=yy.options[yy.selectedIndex].value; 
    OldTextBox.value=time; 
    var parent=yy.parentNode; 
    parent.insertBefore(OldTextBox,yy); 
    parent.removeChild(yy); 
    parent.removeChild(btn); 
*/ 
} 
function SetCurrentYear(selecter,currYear) 
{ 
    if(currYear==null){ 
        currYear=Math.round(selecter.options[selecter.selectedIndex].value); 
    } 
    var dv = arguments[2]; 
    reAppendSelect(selecter,1901,2001,currYear,dv); 
} 
function reAppendSelect(selecter,startIndex,endIndex,selIndex) 
{ 
    while(selecter.options.length>0) 
    { 
        selecter.removeChild(selecter.options[selecter.options.length-1]); 
    } 
    for(i=startIndex;i<=endIndex;i++) 
    { 
        var op=new Option(i,i); 
        selecter.options.add(op); 
        if(arguments[4]!=""){ 
            if(i==arguments[4]) 
                op.selected=true; 
        }else{ 
            if (i==endIndex) 
                op.selected=true; 
        } 
    } 
} 
function al(obj,lissener,func){ 
    if(agt.indexOf('firefox')!=-1){ 
        obj.addEventListener(lissener,function(){eval(func);},false); 
    }else{ 
        obj.attachEvent('on'+lissener,function(){eval(func);}); 
    } 
} 

</script> 
</head> 
<body> 
<input onclick="DateSeter(this);" /> 
</body> 
</html>

Javascript 相关文章推荐
用js实现下载远程文件并保存在本地的脚本
May 06 Javascript
js调用图片隐藏&amp;显示实现代码
Sep 13 Javascript
javascript:FF/Chrome与IE动态加载元素的区别说明
Jan 26 Javascript
js动态添加onclick事件可传参数与不传参数
Jul 29 Javascript
javascript 自定义回调函数示例代码
Sep 26 Javascript
使用mouse事件实现简单的鼠标经过特效
Jan 30 Javascript
AngularJS实现tab选项卡的方法详解
Jul 05 Javascript
浅谈在vue项目中如何定义全局变量和全局函数
Oct 24 Javascript
详解vue+vuex+koa2开发环境搭建及示例开发
Jan 22 Javascript
JS中call和apply函数用法实例分析
Jun 20 Javascript
JS实现的合并两个有序链表算法示例
Feb 25 Javascript
Vue.js递归组件实现组织架构树和选人功能案例分析
Jul 03 Javascript
由prototype_1.3.1进入javascript殿堂-类的初探
Nov 06 #Javascript
javascript读取xml
Nov 04 #Javascript
用javascript操作xml
Nov 04 #Javascript
一个加密JavaScript的开源工具PACKER2.0.2
Nov 04 #Javascript
破除一些网站复制、右键限制
Nov 04 #Javascript
js计数器代码
Nov 04 #Javascript
Js中sort()方法的用法
Nov 04 #Javascript
You might like
php IP及IP段进行访问限制的代码
2008/12/17 PHP
PHP串行化与反串行化实例分析
2016/12/27 PHP
PHP自动补全表单的两种方法
2017/03/06 PHP
一页面多XMLHttpRequest对象
2007/01/22 Javascript
jQuery中的.bind()、.live()和.delegate()之间区别分析
2011/06/08 Javascript
JQuery扩展插件Validate—4设置错误提示的样式
2011/09/05 Javascript
js创建数据共享接口——简化框架之间相互传值
2011/10/23 Javascript
原生js获取宽高与jquery获取宽高的方法关系对比
2014/04/04 Javascript
js获取select默认选中的Option并不是当前选中值
2014/05/07 Javascript
原生js仿jquery实现对Ajax的封装
2016/10/04 Javascript
Nodejs基于LRU算法实现的缓存处理操作示例
2017/03/17 NodeJs
全面解析Node.js 8 重要功能和修复
2017/06/02 Javascript
jQuery第一次运行页面默认触发点击事件的实例
2018/01/10 jQuery
详解简单易懂的 ES6 Iterators 指南和示例
2019/09/24 Javascript
[01:03]DOTA2新的征程 你的脚印值得踏上
2014/08/13 DOTA
python定时器使用示例分享
2014/02/16 Python
Python使用MySQLdb for Python操作数据库教程
2014/10/11 Python
Python实现识别手写数字 简易图片存储管理系统
2018/01/29 Python
python 中字典嵌套列表的方法
2018/07/03 Python
python实现zabbix发送短信脚本
2018/09/17 Python
python判断数字是否是超级素数幂
2018/09/27 Python
Python 普通最小二乘法(OLS)进行多项式拟合的方法
2018/12/29 Python
python实现WebSocket服务端过程解析
2019/10/18 Python
Django自带的加密算法及加密模块详解
2019/12/03 Python
tensorflow 模型权重导出实例
2020/01/24 Python
Python2.6版本pip安装步骤解析
2020/08/17 Python
Python基于pillow库实现生成图片水印
2020/09/14 Python
加拿大女装网上购物:Reitmans
2016/10/20 全球购物
泰国办公用品购物网站:OfficeMate
2018/02/04 全球购物
校长就职演讲稿
2014/01/06 职场文书
大学生自我鉴定书
2014/03/24 职场文书
志愿者活动总结范文
2014/04/26 职场文书
2014年社会实践活动总结范文
2014/04/29 职场文书
篝火晚会策划方案
2014/05/16 职场文书
大学生应聘求职信
2014/05/26 职场文书
一些让Python代码简洁的实用技巧总结
2021/08/23 Python