不错的一个日期输入 动态


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 相关文章推荐
Javascript 实现TreeView CheckBox全选效果
Jan 11 Javascript
jQuery1.6 类型判断实现代码
Sep 01 Javascript
JavaScript异步调用定时方法并停止该方法实现代码
Mar 16 Javascript
escape编码与unescape解码汉字出现乱码的解决方法
Jul 02 Javascript
js如何判断访问是来自搜索引擎(蜘蛛人)还是直接访问
Sep 14 Javascript
jQuery实现仿新浪微博浮动的消息提示框(可智能定位)
Oct 10 Javascript
基于jquery fly插件实现加入购物车抛物线动画效果
Apr 05 Javascript
js实现拖拽功能
Mar 01 Javascript
JavaScript实现的搜索及高亮显示功能示例
Aug 14 Javascript
vue-cli项目修改文件热重载失效的解决方法
Sep 19 Javascript
JSON是什么?有哪些优点?JSON和XML的区别?
Apr 29 Javascript
vue 表单输入框不支持focus及blur事件的解决方案
Nov 17 Vue.js
由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实现MVC
2016/03/02 PHP
php获取当前月与上个月月初及月末时间戳的方法
2016/12/05 PHP
关于php几种字符串连接的效率比较(详解)
2017/02/22 PHP
laravel开发环境homestead搭建过程详解
2020/07/03 PHP
PHP实现Snowflake生成分布式唯一ID的方法示例
2020/08/30 PHP
PHP之header函数详解
2021/03/02 PHP
javascript显示隐藏层比较不错的方法分析
2008/09/30 Javascript
JQuery 选项卡效果(JS与HTML的分离)
2010/04/01 Javascript
jQuery '行 4954 错误: 不支持该属性或方法' 的问题解决方法
2011/01/19 Javascript
js 字符串转化成数字的代码
2011/06/29 Javascript
js操作输入框提示信息且响应鼠标事件
2014/03/25 Javascript
jQuery源码解读之removeAttr()方法分析
2015/02/20 Javascript
Java框架SSH结合Easyui控件实现省市县三级联动示例解析
2016/06/12 Javascript
js实现加载页面就自动触发超链接的示例
2017/08/31 Javascript
手把手教你使用vue-cli脚手架(图文解析)
2017/11/08 Javascript
详解VueJs中的V-bind指令
2018/05/03 Javascript
JQuery Ajax跨域调用和非跨域调用问题实例分析
2019/04/16 jQuery
jquery实现下载图片功能
2019/07/18 jQuery
浅析Vue中拆分视图层代码的5点建议
2019/08/15 Javascript
[02:00]DOTA2英雄COSPLAY闹市街头巡游助威2015国际邀请赛
2015/08/02 DOTA
[34:27]DOTA2上海特级锦标赛B组败者赛 VG VS Spirit第一局
2016/02/26 DOTA
python获取本地计算机名字的方法
2015/04/29 Python
python实现数组插入新元素的方法
2015/05/22 Python
用tensorflow实现弹性网络回归算法
2018/01/09 Python
详解Django中间件执行顺序
2018/07/16 Python
django开发post接口简单案例,获取参数值的方法
2018/12/11 Python
Django框架使用mysql视图操作示例
2019/05/15 Python
详解anaconda离线安装pytorchGPU版
2020/09/08 Python
Python+OpenCV图像处理——图像二值化的实现
2020/10/24 Python
Python如何利用Har文件进行遍历指定字典替换提交的数据详解
2020/11/05 Python
python中delattr删除对象方法的代码分析
2020/12/15 Python
Giglio英国站:意大利奢侈品购物网
2018/03/06 全球购物
环保专业大学生职业规划设计
2014/01/10 职场文书
保安部任务及岗位职责
2014/02/25 职场文书
会计主管竞聘书
2015/09/15 职场文书
《生物入侵者》教学反思
2016/02/16 职场文书