萬盛學電腦網 >> 腳本專題 >> javascript >> 精確到分鐘的js日歷控件,日期選擇器代碼
精確到分鐘的js日歷控件,日期選擇器代碼
精確到分鐘的js日歷控件，日期選擇器代碼，我們知道一般的日歷控件是可以選擇日期的，但是您有沒有見過可以精確到選擇分鐘的?除了選擇年、月、日外，還可以選擇時間，夠精確吧，希望大家喜歡哦。JS日歷插件，這是比較常用的網頁特效哦。
示例：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>精確到分鐘的js日歷控件</TITLE>
<style>
.menu_iframe{position:absolute; visibility:inherit; top:0px; left:0px; width:170px; z-index:-1; filter: Alpha(Opacity=0);}
.cal_table{ border:#333333 solid 1px; border-collapse:collapse; background:#ffffff; font-size:12px}
.cal_table td{ border:1px #ffffff solid; }
.cal_drawdate{ background:#E3EBF6;border-collapse:collapse; width:100%}
.cal_drawdate td{ border:1px #ffffff solid; }
.cal_drawtime{ border:0px #ffffff solid; font-size:12px}
.cal_drawdate td{ border:0px #ffffff solid; }
.m_fieldset {
padding: 0,10,5,10;
text-align: center;
width: 150px;
}
.m_legend {
font-family: Tahoma;
font-size: 11px;
padding-bottom: 5px;
}
.m_frameborder {
border-left: 1px inset #D4D0C8;
border-top: 1px inset #D4D0C8;
border-right: 1px inset #D4D0C8;
border-bottom: 1px inset #D4D0C8;
width: 35px;
height: 19px;
background-color: #FFFFFF;
overflow: hidden;
text-align: right;
font-family: "Tahoma";
font-size: 10px;
}
.m_arrow {
width: 16px;
height: 8px;
background:#cccccc;
font-family: "Webdings";
font-size: 7px;
line-height: 2px;
padding-left: 2px;
cursor: default;
}
.m_input {
width: 12px;
height: 14px;
border: 0px solid black;
font-family: "Tahoma";
font-size: 9px;
text-align: right;
}
.c_fieldset {
padding: 0,10,5,10;
text-align: center;
width: 180px;
}
.c_legend {
font-family: Tahoma;
font-size: 11px;
padding-bottom: 5px;
}
.c_frameborder {
border-left: 1px #D4D0C8;
border-top: 1px #D4D0C8;
border-right: 1px #FFFFFF;
border-bottom: 1px #FFFFFF;
background-color: #FFFFFF;
overflow: hidden;
font-family: "Tahoma";
font-size: 10px;
width:100%;
height:120px;
}
.c_frameborder td {
width: 23px;
height: 16px;
font-family: "Tahoma";
font-size: 11px;
text-align: center;
cursor: default;
}
.c_frameborder .selected {
background-color:#0A246A;
width:12px;
height:12px;
color:white;
display:block;
}
.c_frameborder span {
width:12px;
height:12px;
}
.c_arrow {
width: 16px;
height: 8px;
background:#cccccc;
font-family: "Webdings";
font-size: 7px;
line-height: 2px;
padding-left: 2px;
cursor: default;
}
.c_year {
font-family: "Tahoma";
font-size: 11px;
cursor: default;
width:55px;
height:20px;
border:#99B2D3 solid 1px;
}
.c_month {
width:75px;
height:20px;
font:11px "Tahoma";
border:#99B2D3 solid 1px;
}
.c_dateHead {
background-color:#99B2D3;
color:#ffffff;
border-collapse:collapse;
}
.c_dateHead td{ border:0px #ffffff solid; }
.rightmenu{
float:left; /* 菜單總體水平位置 */
list-style:none;
line-height:19px; /* 一級菜單高 */
background:#1371A0 ; /* 所有菜單移出色 */
font-weight: bold;
padding:0px;
margin:0px;
border: 1px #000000 solid;
}
.rightmenu li{
float:left; /* 菜單總體水平位置 */
list-style:none;
line-height:19px; /* 一級菜單高 */
background:#1371A0 ; /* 所有菜單移出色 */
font-weight: bold;
color:#FFFFFF;
padding:0px;
margin:0px;
border: 1px #FFFFFF solid;
}
.rightmenu li a{
float:left; /* 菜單總體水平位置 */
list-style:none;
line-height:19px; /* 一級菜單高 */
background:#1371A0 ; /* 所有菜單移出色 */
font-weight: bold;
color:#FFFFFF !important;
padding:0px;
margin:0px;
border-right: 0px;
display:block;
width:80px;
}
.rightmenu li a:hover{
float:left; /* 菜單總體水平位置 */
list-style:none;
line-height:19px; /* 一級菜單高 */
background:#B2CFDF ; /* 所有菜單移出色 */
font-weight: bold;
color:#000000 !important;
padding:0px;
margin:0px;
border-right: 0px;
width:80px;
text-decoration:none;
}
</style>
<!-- 烈火網 liehuo．net 歡迎復制,拒絕惡意采集 ｌｉｅｈｕｏ．ｎｅｔ -->
<script>
function CalendarMinute(name,fName)
{
this.name = name;
this.fName = fName || "m_input";
this.timer = null;
this.fObj = null;
this.toString = function()
{
var objDate = new Date();
var sMinute_Common = "class="m_input" maxlength="2" name=""+this.fName+"" onfocus=""+this.name+".setFocusObj(this)" onblur=""+this.name+".setTime(this)" onkeyup=""+this.name+".prevent(this)" onkeypress="if (!/[0-9]/.test(String.fromCharCode(event.keyCode)))event.keyCode=0" onpaste="return false" ondragenter="return false"";
var sButton_Common = "class="m_arrow" onfocus="this.blur()" onmouseup=""+this.name+".controlTime()" disabled"
var str = "";
str += "<table class="cal_drawtime" cellspacing="0" cellpadding="0">"
str += "<tr>"
str += "<td>"
str += "請選擇時間："
str += "</td>"
str += "<td>"
str += "<div class="m_frameborder">"
str += "<input radix="24" value=""+this.formatTime(objDate.getHours())+"" "+sMinute_Common+">:"
str += "<input radix="60" value=""+this.formatTime(objDate.getMinutes())+"" "+sMinute_Common+">"
//str += "<input radix="60" value=""+this.formatTime(objDate.getSeconds())+"" "+sMinute_Common+">"
str += "</div>"
str += "</td>"
str += "<td>"
str += "<table class="cal_drawtime" border="0" cellspacing="0" cellpadding="0">"
str += "<tr><td><button id=""+this.fName+"_up" "+sButton_Common+">5</button></td></tr>"
str += "<tr><td><button id=""+this.fName+"_down" "+sButton_Common+">6</button></td></tr>"
str += "</table>"
str += "</td>"
str += "</tr>"
str += "</table>"
return str;
}
this.play = function()
{
this.timer = setInter
