Date time js control_time date

Copy code The code is as follows: /**//** *This calendar selection control is perfected by tiannet based on previous experience. Most of the code comes from meizz's calendar control. *tiannet has added time selection function, select, object label hiding function, and other small functions. *Usage: * (1) Select date only * (2) Select Date and hour * (3)Select date, hour and minute *Method for setting parameters * (1) Set the date separator setDateSplit(strSplit); the default is "-" * ( 2) Set the separator between date and time setDateTimeSplit(strSplit); the default is " " * (3) Set the time separator setTimeSplit(strSplit); the default is ":" * (4) Set ( The separators in 1), (2), and (3) setSplit(strDateSplit, strDateTimeSplit, strTimeSplit); * (5) Set the start and end years setYearPeriod(intDateBeg, intDateEnd) * Description: * The default returned date and time format is as follows: 2005-02-02 08:08 */ //------------------ Style definition--- --------------------------// //Same style for function buttons var s_tiannet_turn_base = "height:16px;font-size: 9pt;color:white;border:0 solid #CCCCCC;cursor:hand;background-color:#2650A6;"; //Buttons for turning year, month, etc. var s_tiannet_turn = "width:28px;" s_tiannet_turn_base; //Close, clear, etc. button styles var s_tiannet_turn2 = "width:22px;" s_tiannet_turn_base; //Year selection drop-down box var s_tiannet_select = "width:64px;display:none ;"; //Month, hour, minute selection drop-down box var s_tiannet_select2 = "width:46px;display:none;"; //Style of the date selection control body var s_tiannet_body = "width:150;background-color:#2650A6;display:none;z-index:9998;position:absolute;" "border-left:1 solid #CCCCCC;border-top:1 solid #CCCCCC;border -right:1 solid #999999;border-bottom:1 solid #999999;"; //Display the style of td of day var s_tiannet_day = "width:21px;height:20px;background-color:# D8F0FC;font-size:10pt;"; //Font style var s_tiannet_font = "color:#FFCC00;font-size:9pt;cursor:hand;"; //Link style var s_tiannet_link = "text-decoration:none;font-size:9pt;color:#2650A6;"; //Horizontal line var s_tiannet_line = "border-bottom:1 solid #6699CC"; //------------------ Variable definition----------------------------- -// var tiannetYearSt = 1950; //Selectable start year var tiannetYearEnd = 2010; //Selectable end year var tiannetDateNow = new Date(); var tiannetYear = tiannetDateNow.getFullYear(); //The initial value of the variable that defines the year var tiannetMonth = tiannetDateNow.getMonth() 1; //The initial value of the variable that defines the month var tiannetDay = tiannetDateNow.getDate(); var tiannetHour = 8;//tiannetDateNow.getHours(); var tiannetMinute = 0;//tiannetDateNow.getMinutes(); var tiannetArrDay=new Array(42); //Define the array for writing dates var tiannetDateSplit = "-"; //The separator for date var tiannetDateTimeSplit = " "; //The separator between date and time var tiannetTimeSplit = ":"; //The separator for time Symbol var tiannetOutObject; //Object receiving date and time var arrTiannetHide = new Array();//Label that is forced to be hidden var m_bolShowHour = false;//Whether to display the hour var m_bolShowMinute = false;//Whether to display minutes

setRealDayCount();//Set the real day of the month tiannetWriteHead() ; var strDateFont1 = "", strDateFont2 = "" //Handle date display style for (var i = 0; i var day1 = 1; var firstday = new Date(yy,mm-1,1).getDay(); //The day of the week of the first day of a certain month for (var i = firstday; day1 tiannetArrDay[i]=day1;day1 ; } //If used to display the last row of day If the value of the first cell is empty, the entire row is hidden. //if(tiannetArrDay[35] == ""){ // document.all.trTiannetDay5.style.display = "none"; //} else { // document .all.trTiannetDay5.style.display = ""; //} for (var i = 0; i var da = eval("document.all.tdTiannetDay " i) //Write the date and week arrangement of the new month if (tiannetArrDay[i]!="") { //Judge whether it is a weekend, if it is a weekend, change it to red font if(i % 7 == 0 || (i 1) % 7 == 0){ strDateFont1 = " " strDateFont2 = " " } else { strDateFont1 = ""; strDateFont2 = "" } da.innerHTML = strDateFont1 tiannetArrDay[i] strDateFont2; //If it is the currently selected day, Then change the color if(tiannetArrDay[i] == tiannetDay ) { da.style.backgroundColor = "#CCCCCC"; } else { da.style.backgroundColor = "#EFEFEF" ; } da.style.cursor="hand" } else { da.innerHTML="";da.style.backgroundColor="";da.style.cursor="default " } }//end for tiannetSetValue(false);//Assign a value to the text box, but do not hide this control }//end function tiannetSetDay //According to option Value selection option function checkSelect(objSelect,selectValue) { var count = parseInt(objSelect.length); if( selectValue selectValue = selectValue.substring(1,2); } for(var i = 0;i if(objSelect.options[i].value == selectValue){ objSelect.selectedIndex = i; break; } }//for } //Select the year, month, hour, minute, etc. drop-down boxes function selectObject(){ //If the year is less than the minimum allowed year, create the corresponding option if( tiannetYear for( var i = tiannetYear;i createOption(document.all.selTianYear,i,i "Year"); } tiannetYearSt = tiannetYear; } //If the year exceeds the maximum allowed year, Then create the corresponding option if( tiannetYear > tiannetYearEnd ) { for( var i = tiannetYearEnd 1;i createOption(document.all.selTianYear,i,i "Year"); } tiannetYearEnd = tiannetYear; } checkSelect(document.all.selTianYear,tiannetYear); checkSelect(document.all.selTianMonth,tiannetMonth); if( m_bolShowHour ) checkSelect(document.all.selTianHour,tiannetHour); if( m_bolShowMinute ) checkSelect(document.all.selTianMinute,tiannetMinute); } //Assign a value to the control that accepts date and time //Parameter bolHideControl - whether to hide the control function tiannetSetValue(bolHideControl){ var value = ""; if( !tiannetDay || tiannetDay == "" ){ tiannetOutObject. value = value; return; } var mm = tiannetMonth; var day = tiannetDay; if( mm if( day value = tiannetYear tiannetDateSplit mm tiannetDateSplit day; if ( m_bolShowHour ){ var hour = tiannetHour; if( hour value = tiannetDateTimeSplit hour; } if( m_bolShowMinute ){ var minute = tiannetMinute; if( minute value = tiannetTimeSplit minute; } tiannetOutObject.value = value; //document.all.divTiannetDate.style.display = "none"; if( bolHideControl ) { tiannetHideControl() ; } } //Whether to display the time function showTime(){ if( !m_bolShowHour && m_bolShowMinute){ alert("If you want to select minutes, it must be possible Choose the hour!"); return; } hideElementsById(new Array("tiannetHourHead","selTianHour","tiannetMinuteHead","selTianMinute"),true); if( m_bolShowHour ){ //Show hours hideElementsById(new Array("tiannetHourHead"),false); } if( m_bolShowMinute){ //Show minutes hideElementsById(new Array("tiannetMinuteHead "),false); } } //Pop up the calendar selection control to allow the user to select function tiannetPopCalendar(){ //Hide the drop-down box and display the corresponding head hideElementsById(new Array("selTianYear","selTianMonth","selTianHour","selTianMinute"),true); hideElementsById(new Array("tiannetYearHead","tiannetMonthHead","tiannetHourHead"," tiannetMinuteHead"),false); tiannetSetDay(tiannetYear,tiannetMonth); tiannetWriteHead(); showTime(); var dads = document.all.divTiannetDate.style; var iX , iY;

x = document.all.divTiannetDate.offsetLeft; y = document.all.divTiannetDate.offsetTop; h = document.all.divTiannetDate.offsetHeight; w = document.all.divTiannetDate.offsetWidth;

for (var i = 0; i {

var obj = document.all.tags(strTagName)[i]; if (! obj || ! obj.offsetParent) continue; / / Get the relative coordinates of the element to the BODY mark var objLeft = obj.offsetLeft; var objTop = obj.offsetTop; var objHeight = obj.offsetHeight; var objWidth = obj.offsetWidth; var objParent = obj.offsetParent;

while (objParent.tagName.toUpperCase() != "BODY"){ objLeft = objParent.offsetLeft; objTop = objParent.offsetTop; objParent = objParent.offsetParent; } //alert("Control left end:" x "select left end" (objLeft objWidth) "Control bottom:" (y h) "select height:" objTop);

var bolHide = true; if( obj.style.display == "none" || obj.style.visibility == "hidden" || obj.getAttribute("Author") == " tiannet" ){ //If the label itself is hidden, there is no need to hide it. If it is a drop-down box in a control, there is no need to hide it. bolHide = false; } if( ( (objLeft objWidth) > ){ //arrTiannetHide.push(obj);//Record the hidden label object arrTiannetHide[arrTiannetHide.length] = obj; obj.style.visibility = "hidden"; }

} } //Show hidden tags function tiannetShowObject(){ for(var i = 0;i //alert(arrTiannetHide[i]); arrTiannetHide[i].style.visibility = ""; } } //Initialization date. function tiannetInitDate(strDate){ var arr = strDate.split(tiannetDateSplit); tiannetYear = arr[0]; tiannetMonth = arr[1]; tiannetDay = arr[2 ]; } //Clear function tiannetClear(){ tiannetOutObject.value = ""; tiannetHideControl(); } //Close on any click The control function document.onclick(){ with(window.event.srcElement){ if (tagName != "INPUT" && getAttribute("Author") != "tiannet") tiannetHideControl(); } } //Press the ESC key to close the control function document.onkeypress(){ if( event.keyCode == 27 ){ tiannetHideControl(); } } (1) Select date only

(2)Select date and hour (3) Select date, hour and minute Amount summary

Date time js control_time date

Related articles