不错的一个日期输入 动态


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 使td内容不换行不撑开
Nov 29 Javascript
E3 tree 1.6在Firefox下显示问题的修复方法
Jan 30 Javascript
Javascript 实现的数独解题算法网页实例
Oct 15 Javascript
基于Vue.js的表格分页组件
May 22 Javascript
require.js配合插件text.js实现最简单的单页应用程序
Jul 12 Javascript
JavaScript实现大图轮播效果
Jan 11 Javascript
vue-cli入门之项目结构分析
Apr 20 Javascript
React中ES5与ES6写法的区别总结
Apr 21 Javascript
解决vue-cli中stylus无法使用的问题方法
Jun 19 Javascript
vue中实现移动端的scroll滚动方法
Mar 03 Javascript
vue实现双向绑定和依赖收集遇到的坑
Nov 29 Javascript
Vue+penlayers实现多边形绘制及展示
Dec 24 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
实现 win2003 下 mysql 数据库每天自动备份
2006/12/06 PHP
从零开始学YII2框架(二)通过 Composer 安装扩展插件
2014/08/20 PHP
Windows2003下php5.4安装配置教程(IIS)
2016/06/30 PHP
Laravel6.0.4中将添加计划任务事件的方法步骤
2019/10/15 PHP
jquery 图片截取工具jquery.imagecropper.js
2010/04/09 Javascript
javascript cookie操作类的实现代码小结附使用方法
2010/06/02 Javascript
通过jQuery打造支持汉字,拼音,英文快速定位查询的超级select插件
2010/06/18 Javascript
jquery ajax例子返回值详解
2012/09/11 Javascript
artDialog双击会关闭对话框的修改过程分享
2013/08/05 Javascript
jquery.autocomplete修改实现键盘上下键自动填充示例
2013/11/19 Javascript
JavaScript自定义等待wait函数实例分析
2015/03/23 Javascript
jQuery解析Json实例详解
2015/11/24 Javascript
微信小程序 解决请求服务器手机预览请求不到数据的方法
2017/01/04 Javascript
详解require.js配置路径的用法和css的引入
2017/09/06 Javascript
Vue 滚动行为的具体使用方法
2017/09/13 Javascript
vue2中的keep-alive使用总结及注意事项
2017/12/21 Javascript
vue里面父组件修改子组件样式的方法
2018/02/03 Javascript
浅谈Webpack 持久化缓存实践
2018/03/22 Javascript
vue项目中jsonp跨域获取qq音乐首页推荐问题
2018/05/30 Javascript
基于Angularjs-router动态改变Title值的问题
2018/08/30 Javascript
JS常用排序方法实例代码解析
2020/03/03 Javascript
Python Web框架Flask下网站开发入门实例
2015/02/08 Python
快速了解Python中的装饰器
2018/01/11 Python
基于python和flask实现http接口过程解析
2020/06/15 Python
PyQt5的QWebEngineView使用示例
2020/10/20 Python
详解Python3.8+PyQt5+pyqt5-tools+Pycharm配置详细教程
2020/11/02 Python
澳大利亚最大的女装零售商:Millers
2017/09/10 全球购物
Whittard官方海外旗舰店:英国百年茶叶品牌
2018/02/22 全球购物
万宝龙英国官网:Montblanc手表、书写工具、皮革和珠宝
2018/10/16 全球购物
Allen Edmonds官方网站:一家美国优质男士鞋类及配饰制造商
2019/03/12 全球购物
自荐书格式
2013/12/01 职场文书
公司保密承诺书
2014/03/27 职场文书
《金色的脚印》教后反思
2014/04/23 职场文书
公安干警正风肃纪心得体会
2016/01/15 职场文书
python调试工具Birdseye的使用教程
2021/05/25 Python
Python万能模板案例之matplotlib绘制直方图的基本配置
2022/04/13 Python