<!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>
不错的一个日期输入 动态
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@