日期与时间选择器

 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>日期和时间选择器</title>
<script language="javascript" src=""></script>
</head>
<body>
<pre>
/*/////////////////////////////////////////////////////////////////
函数说明：风声日期和时间选择器，整个功能只有一个函数调用极其方便
功能说明：年份根据输入（当前）日期前后5年自动选择，1000--9000年设定
作　　者：风声
电子邮件：rumor@17560.net 
函数原型：
function selectTime(thisIdName[,mode])
参数说明：
 thisIdName：接受返回值的对象ID名称
 mode：  返回值类型
  0：默认值，返回yyyy-mm-dd hh-mm-ss
  1：返回yyyy-mm-dd
  2：返回hh-mm-ss
  3：返回mm-dd
  4：返回hh-mm
  5：返回yyyy-mm-dd hh-mm
修正时间：2005-11-29
时　　间：2004-5-26
////////////////////////////////////////////////////////////////*/
</pre>
<input type="text" value="2003-3-12 12:12:12" name="aa">
<br>
<input type="button" value="选择mode=0" onclick="selectTime('aa',0)">
<input name="button" type="button" onclick="selectTime('aa',1)" value="选择mode=1">
<input name="button2" type="button" onclick="selectTime('aa',2)" value="选择mode=2">
<input name="button3" type="button" onclick="selectTime('aa',3)" value="选择mode=3">
<input name="button4" type="button" onclick="selectTime('aa',4)" value="选择mode=4">
<input name="button42" type="button" onclick="selectTime('aa',5)" value="选择mode=5">
</body>
</html>
    
js代码:
/*/////////////////////////////////////////////////////////////////
函数说明：风声日期和时间选择器，整个功能只有一个函数调用极其方便
作　　者：风声
电子邮件：rumor@17560.net 
函数原型：
function selectTime(thisIdName[,mode])
参数说明：
 thisIdName：接受返回值的对象ID名称
 mode：  返回值类型
  0：默认值，返回yyyy-mm-dd hh-mm-ss
  1：返回yyyy-mm-dd
  2：返回hh-mm-ss
  3：返回mm-dd
  4：返回hh-mm
  5：返回yyyy-mm-dd hh-mm
修正时间：2005-11-29
时　　间：2004-5-26
////////////////////////////////////////////////////////////////*/
function timeFormat(i){return((i<10)?"0"+i.toString():i.toString());}
function selectTime(thisName){
var argv=selectTime.arguments;
var argc=selectTime.arguments.length;
var mode=(argc>1)?argv[1]:0;
try{
 var strTime=document.getElementById(thisName).value;
 strTime=strTime.replace(/[-:]/g," ");
}catch(e){
 return false;
}
var dateNow = new Date();
var intYear = dateNow.getYear();
var intMonth = dateNow.getMonth();
var intDate = dateNow.getDate();
var intHour = dateNow.getHours();
var intMinute = dateNow.getMinutes();
var intSecond = dateNow.getSeconds();
switch(mode){
 case 0:break;
 case 1:break;
 case 2:strTime=intYear+" "+(intMonth+1)+" "+intDay+" "+strTime;break;
 case 3:strTime=intYear+" "+strTime;break;
 case 4:strTime=intYear+" "+(intMonth+1)+" "+intDay+" "+strTime;break;
 case 5:break;
}
var arrTime=strTime.split(" ");
var i=0;
//----年
if(!isNaN(arrTime[0])){
 i=parseInt(arrTime[0],10);
 
 if(i>1000&&i<9000)intYear=i;
}
//----月
if(!isNaN(arrTime[1])){
 i=parseInt(arrTime[1],10);
 if(i>0&&i<13)intMonth=i-1;
}
//----日历开始
var dateFirst=new Date(intYear,intMonth,1);
var intDay=dateFirst.getDay();
//----日历结束
var arrDays=new Array(31,28,31,30,31,30,31,31,30,31,30,31);
arrDays[1]+=!(intYear%4);
var intDays=arrDays[intMonth];
//----日
if(!isNaN(arrTime[2])){
 i=parseInt(arrTime[2],10);
 if(i>0&&i<=intDays)intDate=i;
}
//----时
if(!isNaN(arrTime[3])){
 i=parseInt(arrTime[3],10);
 if(i>=0&&i<24)intHour=i;
}
//----分
if(!isNaN(arrTime[4])){
 i=parseInt(arrTime[4],10);
 if(i>=0&&i<60)intMinute=i;
}
//----秒
if(!isNaN(arrTime[5])){
 i=parseInt(arrTime[5],10);
 if(i>=0&&i<60)intSecond=i;
}
var myWindow = window.open("","selectTime","height=304,width=404");
var arrMonth=new Array("一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月");
var strHTML="";
strHTML+="<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312">";
strHTML+="<title>选择日期和时间</title><style type="text/css"><!--n";
strHTML+="table {font-size: 12px;}";
strHTML+=".f8 { font-size: 7px;}";
strHTML+=".myinput {text-align: center;width: 20px;border: 0px;height: 16px;vertical-align: baseline;}";
strHTML+=".boxIn {border-top: 2px solid #423E3B;border-right: 1px solid #FFFCF5;border-bottom: 1px solid #FFFCF5;border-left: 2px solid #423E3B;background: #FFFFFF;}";
strHTML+=".myButton {height: 10px;width: 25px;font-size: 4px;}";
strHTML+="n--></style>";
strHTML+="<script language="JavaScript">";
//----函数
strHTML+="var day="+intDate+";";
strHTML+="var strTemp="",intTemp=0;";
strHTML+="function onTimeKeyUp(obj,num,maxnum,next){";
strHTML+="var strTemp=obj.value;"; 
strHTML+="if(isNaN(strTemp))obj.value=strTemp.substring(0,strTemp.length-1);";
strHTML+="else{var intTemp=parseInt(strTemp,10);";
strHTML+="if(intTemp>maxnum)obj.value=strTemp.substring(0,strTemp.length-1);";
strHTML+="else if(intTemp>num){next.focus();}";
strHTML+="}}";
strHTML+="function setCalendar(intYear,intMonth,intDate){";
strHTML+="var dateFirst=new Date(intYear,intMonth,1);";
strHTML+="var intDay=dateFirst.getDay();";
strHTML+="var arrDays=new Array(31,28,31,30,31,30,31,31,30,31,30,31);";
strHTML+="arrDays[1]+=!(intYear%4);";
strHTML+="var intDays=arrDays[intMonth],str="";";
strHTML+="if(intDate>intDays)intDate=intDays;";
strHTML+="intDay--;";
strHTML+="for(var i=0;i<42;i++){";
strHTML+="if(i<=intDay)date[i].innerHTML="";";
strHTML+="else if(i<=intDays+intDay){str=i-intDay;if(str<10)str="&nbsp;"+str;";
strHTML+="if(i-intDay==intDate){strTemp=str;";
strHTML+="str="<font color='#FFFFFF' style='background:#0A246A'>"+str+"</font>";";
strHTML+="intTemp=i;day=intDate;}";
strHTML+="date[i].innerHTML=str;}";
strHTML+="else date[i].innerHTML="";";
strHTML+="}}";
strHTML+="function setNewDate(num){"
strHTML+="var str=date[num].innerHTML;";
strHTML+="var i=str.length;";
strHTML+="if(i>1&&i<8){";
strHTML+="date[intTemp].innerHTML=strTemp;intTemp=num;strTemp=str;";
strHTML+="date[num].innerHTML="<font color='#FFFFFF' style='background:#0A246A'>"+strTemp+"</font>";";
strHTML+="if(i>2)str=str.substr(i-1);day=parseInt(str,10);}}";
strHTML+="function isOk(){";
switch(mode){
case 0:strHTML+="window.opener.document.getElementById(""+thisName+"").value=year.value+"-"+(parseInt(month.value,10)+1)+"-"+day+" "+hour.value+":"+minute.value+":"+second.value;";break;
case 1:strHTML+="window.opener.document.getElementById(""+thisName+"").value=year.value+"-"+(parseInt(month.value,10)+1)+"-"+day;";break;
case 2:strHTML+="window.opener.document.getElementById(""+thisName+"").value=hour.value+":"+minute.value+":"+second.value;";break;
case 3:strHTML+="window.opener.document.getElementById(""+thisName+"").value=(parseInt(month.value,10)+1)+"-"+day;";break;
case 4:strHTML+="window.opener.document.getElementById(""+thisName+"").value=hour.value+":"+minute.value;";break;
case 5:strHTML+="window.opener.document.getElementById(""+thisName+"").value=year.value+"-"+(parseInt(month.value,10)+1)+"-"+day+" "+hour.value+":"+minute.value;";break;
}
strHTML+="window.close();}";
strHTML+="function timeFormat(i){return((i<10)?'0'+i.toString():i.toString());}";
strHTML+="function timeAdd(obj0){var i=parseInt(obj.value,10);obj.value=timeFormat((i<intMax)?i+1:0);obj.select();obj0.focus();}";
strHTML+="function timeRid(obj0){var i=parseInt(obj.value,10);obj.value=timeFormat((i>0)?i-1:intMax);obj.select();obj0.focus();}";
strHTML+="</script>";
strHTML+="</head>";
strHTML+="<body bgcolor="#D4CFC9" style="border:0;margin:5" oncontextmenu="return(false)">";
strHTML+="<table width="394" border="0" align="center" cellpadding="0" cellspacing="0">";
strHTML+="<tr>";
strHTML+="<td height="24" align="center" style="border-left:1px solid #FFFCF5;border-top:1px solid #FFFCF5">日期和时间</td>";
strHTML+="<td colspan="2" style="border-left:2px solid #423E3B;border-bottom:1px solid #FFFCF5">&nbsp;</td>";
strHTML+="</tr><tr> ";
strHTML+="<td height="200" colspan="2" align="center" style="border-left:1px solid #FFFCF5;margin:5px;">";
strHTML+="<fieldset style="width:190;height:190"><legend>日期(D)</legend>";
strHTML+="<select name="month" id="month" style="width:82" onChange="setCalendar(year.value,month.value,day)">";
//----月
for(i=0;i<12;i++){
 strHTML+="<option value=""+i+""";
 if(i==intMonth)strHTML+=" selected";
 strHTML+=">"+arrMonth[i]+"</option>";
}
strHTML+="</select> ";
strHTML+="<select name="year" id="year" style="width:82" onChange="setCalendar(year.value,month.value,day)">";
//----年
for(i=intYear-5;i<intYear+5;i++){
 strHTML+="<option value=""+i+""";
 if(i==intYear)strHTML+=" selected";
 strHTML+=">"+i+"年</option>";
}
strHTML+="</select>";
strHTML+="<div class="f8">&nbsp;</div>";
strHTML+="<table width="168" height="133" border="0" cellpadding="2" cellspacing="0" class="boxIn" style="cursor:default">";
strHTML+="<tr align="center" bgcolor="#999999">";
strHTML+="<td width=24 height=19>日</td><td width=24>一</td><td width=24>二</td><td width=24>三</td><td width=24>四</td><td width=24>五</td><td width=24>六</td>";
//----日
for(i=0;i<42;i++){
 if(i%7==0)strHTML+="</tr><tr align="center">";
 strHTML+="<td id="date" height=19 onclick="setNewDate("+i+")">&nbsp;</td>";
}
strHTML+="</tr></table></fieldset></td>";
strHTML+="<td align="center" style="border-right:2px solid #423E3B;margin:5px;">";
strHTML+="<fieldset style="width:170;height:190"><legend>时间(T)</legend>";
strHTML+="<div style="height:142">&nbsp;</div>";
strHTML+="<table width="150" border="0" cellspacing="2" cellpadding="0"><tr>";
strHTML+="<td width="125" align="right" class="boxIn">";
//----时
strHTML+="<input name="hour" type="text" class="myinput" id="hour" onBlur="if(this.value=='')this.value='00';" onFocus="this.select();obj=this;intMax=23" value=""+timeFormat(intHour)+"" maxlength="2" onkeyup="onTimeKeyUp(this,2,23,minute)">:";
//----分
strHTML+="<input name="minute" type="text" class="myinput" id="minute" onBlur="if(this.value=='')this.value='00';" onFocus="this.select();obj=this;intMax=59" value=""+timeFormat(intMinute)+"" maxlength="2" onkeyup="onTimeKeyUp(this,5,59,second)">:";
//----秒
strHTML+="<input name="second" type="text" class="myinput" id="second" onBlur="if(this.value=='')this.value='00';" onFocus="this.select();obj=this;intMax=59" value=""+timeFormat(intSecond)+"" maxlength="2" onkeyup="onTimeKeyUp(this,59,59,null)">";
strHTML+="</td>";
strHTML+="<td width="25"><input name="Submit" type="button" class="myButton" value="◆" onClick="timeAdd(this)">";
strHTML+="<input name="Submit4" type="button" class="myButton" value="◆" onClick="timeRid(this)"></td>";
strHTML+="</tr></table></fieldset></td>";
strHTML+="</tr><tr> ";
strHTML+="<td height="40" colspan="3" style="border-left:1px solid #FFFCF5;border-right:2px solid #423E3B;border-bottom:2px solid #423E3B;margin:5px;">";
strHTML+="　Rumor Date And Time Selector<br><br>";
strHTML+="</td></tr><tr>";
strHTML+="<td width="80" height="8"></td>";
strHTML+="<td width="127" align="right"></td>";
strHTML+="<td width="187" align="right"></td>";
strHTML+="</tr><tr><td>&nbsp;</td>";
strHTML+="<td colspan="2" align="right">";
strHTML+="<input type="button" name="Submit1" value="　确定　" onclick="isOk()"> ";
strHTML+="<input type="button" name="Submit2" value="　取消　" onclick="window.close()"> ";
strHTML+="<input type="button" name="Submit3" value="　应用　" disabled></td>";
strHTML+="</tr></table></body></html>";
strHTML+="<script language="javascript">var obj=document.getElementById("hour"),intMax=23;";
strHTML+="setCalendar("+intYear+","+intMonth+","+intDate+");</script>";
myWindow.document.write(strHTML);
myWindow.document.close();
}
    
 

时间： 2024-10-14 18:46:34

日期与时间选择器的相关文章

只显示月、日、时-Android请教:同时显示日期和时间选择器

问题描述 Android请教:同时显示日期和时间选择器 开发中遇到一个问题: 需要在一个控件中同时显示日期和时间选择器 要求:日期只显示月.日:时间只显示24小时制的时 网上翻了好久没看见合适的,请教各位路过的大神给一些思路或者解决方案 解决方案 http://www.iteye.com/topic/1131942挺好的,不要年份的话,可以到xml里面将年份隐藏 解决方案二: http://www.2cto.com/kf/201407/320686.html 解决方案三: 朋友你好,你发的这个链

Android日期和时间选择器实现代码

抽出来了一个方法来选择时间(这里自己规定的只能选择当前时间以后的日期),日期选择完毕就会自动弹出时间选择器让选择时间. /** * 选择日期和时间 */ private void selectDataAndTime() { // 获取当前时间 final Calendar calendar = Calendar.getInstance(); /* * toast("当前时间是:" + calendar.get(Calendar.YEAR) + "," + * cal

js日期时间选择器bootstrap

使用的是开源的架构 可以git clone git://github.com/smalot/bootstrap-datetimepicker.git 截图 十年视图 年视图 月视图 日视图* 小时视图 * Day view w/ meridian * Hour view w/ meridian * (*) Added views to select the time part. 依赖 需要bootstrap的下拉菜单组件 (dropdowns.less) 的某些样式,还有bootstrap的sp

Android零基础入门第57节：日期选择器DatePicker和时间选择器TimePicker

原文:Android零基础入门第57节:日期选择器DatePicker和时间选择器TimePicker    在实际开发中,经常会遇见一些时间选择器.日期选择器.数字选择器等需求,那么从本期开始来学习Android中常用选择器,今天学习的是DatePicker和TimePicker.     一.DatePicker       DatePicker是一个比较简单的组件,从FrameLayout派生而来,供用户选择日期.其在FrameLayout的基础上提供了一些方法来获取当前用户所选择的日期,

安卓开发:Android日期时间选择器

这里贴上一个Demo的源码,分享一下:  代码如下 复制代码 import java.text.SimpleDateFormat; import java.util.ArrayList; import java.util.Date; import android.app.Activity; import android.os.Bundle; import android.view.Gravity; import android.view.View; import android.view.Vie

Android时间选择器、日期选择器实现代码_Android

本文为大家分享了两款选择器,一款可以针对时间进行选择.一款可以针对日期进行选择,供大家参考,具体内容如下 一.时间选择器1.1.布局 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.andr

Android时间选择器、日期选择器实现代码

本文为大家分享了两款选择器,一款可以针对时间进行选择.一款可以针对日期进行选择,供大家参考,具体内容如下 一.时间选择器 1.1.布局 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.and

手机网站日期时间选择器（专业为移动而生）

这是一个适合移动设备WEB应用的日期和时间拾取器,在桌面版的日期拾取器我们一般用jQuery UI的datepicker插件,而移动手机版的日期拾取器则可以根据项目需求选择与jQuery Mobile配合的mobiscroll.js插件,它提供了友好的日期和时间选择操作界面,且易于配置和使用.   首先我们加载相关插件和样式文件,该插件基于jQuery和jQuery.mobile所以首先需要加载这两个库文件,然后再加载mobiscroll.js插件以及相关CSS文件. <script src=&qu

Bootstrap时间选择器datetimepicker和daterangepicker使用实例解析_javascript技巧

在bootstrap中的时间选择器有两种:dateTimePicker和dateRangePicker 1.dateTimePicker好像是官方嫡插件: 需要的文件: <link rel="stylesheet" href="css/bootstrap-datetimepicker.min.css"> <script src="js/bootstrap-datetimepicker.min.js"></script