作家
登录

javascript英文日期(有时间)选择器

作者: 来源:www.28hudong.com 2013-03-30 03:30:38 阅读 我要评论

var languageCode = 'en'; // Possible values: en,ge,no,nl,es,pt-br,fr // en = english, ge = german, no = norwegian,nl = dutch, es = spanish, pt-br = portuguese, fr = french, da = danish, hu = hungarian(Use UTF-8 doctype for hungarian) var calendar_display_time = true; // Format of current day at the bottom of the calendar // [todayString] = the value of todayString // [dayString] = day of week (examle: mon, tue, wed...) // [UCFdayString] = day of week (examle: Mon, Tue, Wed...) ( First letter in uppercase) // [day] = Day of month, 1..31 // [monthString] = Name of current month // [year] = Current year var todayStringFormat = '[todayString] [UCFdayString]. [day]. [monthString] [year]'; var pathToImages = 'images/'; // Relative to your HTML file var speedOfSelectBoxSliding = 200; // Milliseconds between changing year and hour when holding mouse over "-" and "+" - lower value = faster var intervalSelectBox_minutes = 5; // Minute select box - interval between each option (5 = default) var calendar_offsetTop = 0; // Offset - calendar placement - You probably have to modify this value if you're not using a strict doctype var calendar_offsetLeft = 0; // Offset - calendar placement - You probably have to modify this value if you're not using a strict doctype var calendarDiv = false; var MSIE = false; var Opera = false; if(navigator.userAgent.indexOf('MSIE')>=0 && navigator.userAgent.indexOf('Opera')<0)MSIE=true; if(navigator.userAgent.indexOf('Opera')>=0)Opera=true; switch(languageCode){ case "en": /* English */ var monthArray = ['January','February','March','April','May','June','July','August','September','October','November','December']; var monthArrayShort = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec']; var dayArray = ['Mon','Tue','Wed','Thu','Fri','Sat','Sun']; var weekString = 'Week'; var todayString = ''; break; case "ge": /* German */ var monthArray = ['Januar','Februar','M鋜z','April','Mai','Juni','Juli','August','September','Oktober','November','Dezember']; var monthArrayShort = ['Jan','Feb','Mar','Apr','Mai','Jun','Jul','Aug','Sep','Okt','Nov','Dez']; var dayArray = ['Mon','Die','Mit','Don','Fre','Sam','Son']; var weekString = 'Woche'; var todayString = 'Heute'; break; case "no": /* Norwegian */ var monthArray = ['Januar','Februar','Mars','April','Mai','Juni','Juli','August','September','Oktober','November','Desember']; var monthArrayShort = ['Jan','Feb','Mar','Apr','Mai','Jun','Jul','Aug','Sep','Okt','Nov','Des']; var dayArray = ['Man','Tir','Ons','Tor','Fre','Lør','Søn']; var weekString = 'Uke'; var todayString = 'Dagen i dag er'; break; case "nl": /* Dutch */ var monthArray = ['Januari','Februari','Maart','April','Mei','Juni','Juli','Augustus','September','Oktober','November','December']; var monthArrayShort = ['Jan','Feb','Mar','Apr','Mei','Jun','Jul','Aug','Sep','Okt','Nov','Dec']; var dayArray = ['Ma','Di','Wo','Do','Vr','Za','Zo']; var weekString = 'Week'; var todayString = 'Vandaag'; break; case "es": /* Spanish */ var monthArray = ['Enero','Febrero','Marzo','April','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre']; var monthArrayShort =['Ene','Feb','Mar','Abr','May','Jun','Jul','Ago','Sep','Oct','Nov','Dic']; var dayArray = ['Lun','Mar','Mie','Jue','Vie','Sab','Dom']; var weekString = 'Semana'; var todayString = 'Hoy es'; break; case "pt-br": /* Brazilian portuguese (pt-br) */ var monthArray = ['Janeiro','Fevereiro','Março','Abril','Maio','Junho','Julho','Agosto','Setembro','Outubro','Novembro','Dezembro']; var monthArrayShort = ['Jan','Fev','Mar','Abr','Mai','Jun','Jul','Ago','Set','Out','Nov','Dez']; var dayArray = ['Seg','Ter','Qua','Qui','Sex','Sáb','Dom']; var weekString = 'Sem.'; var todayString = 'Hoje é'; break; case "fr": /* French */ var monthArray = ['Janvier','F関rier','Mars','Avril','Mai','Juin','Juillet','Ao鹴','Septembre','Octobre','Novembre','D閏embre']; var monthArrayShort = ['Jan','Fev','Mar','Avr','Mai','Jun','Jul','Aou','Sep','Oct','Nov','Dec']; var dayArray = ['Lun','Mar','Mer','Jeu','Ven','Sam','Dim']; var weekString = 'Sem'; var todayString = "Aujourd'hui"; break; case "da": /*Danish*/ var monthArray = ['januar','februar','marts','april','maj','juni','juli','august','september','oktober','november','december']; var monthArrayShort = ['jan','feb','mar','apr','maj','jun','jul','aug','sep','okt','nov','dec']; var dayArray = ['man','tirs','ons','tors','fre','lør','søn']; var weekString = 'Uge'; var todayString = 'I dag er den'; break; case "hu": /* Hungarian - Remember to use UTF-8 encoding, i.e. the <meta> tag */ var monthArray = ['Janu谩r','Febru谩r','M谩rcius','?prilis','M谩jus','J煤nius','J煤lius','Augusztus','Szeptember','Okt贸ber','November','December']; var monthArrayShort = ['Jan','Feb','M谩rc','?pr','M谩j','J煤n','J煤l','Aug','Szep','Okt','Nov','Dec']; var dayArray = ['H茅','Ke','Sze','Cs','P茅','Szo','Vas']; var weekString = 'H茅t'; var todayString = 'Mai nap'; break; case "it": /* Italian*/ var monthArray = ['Gennaio','Febbraio','Marzo','Aprile','Maggio','Giugno','Luglio','Agosto','Settembre','Ottobre','Novembre','Dicembre']; var monthArrayShort = ['Gen','Feb','Mar','Apr','Mag','Giu','Lugl','Ago','Set','Ott','Nov','Dic']; var dayArray = ['Lun',';Mar','Mer','Gio','Ven','Sab','Dom']; var weekString = 'Settimana'; var todayString = 'Oggi è il'; break; case "sv": /* Swedish */ var monthArray = ['Januari','Februari','Mars','April','Maj','Juni','Juli','Augusti','September','Oktober','November','December']; var monthArrayShort = ['Jan','Feb','Mar','Apr','Maj','Jun','Jul','Aug','Sep','Okt','Nov','Dec']; var dayArray = ['Mån','Tis','Ons','Tor','Fre','Lör','Sön']; var weekString = 'Vecka'; var todayString = 'Idag är det den'; break; } var daysInMonthArray = [31,28,31,30,31,30,31,31,30,31,30,31]; var currentMonth; var currentYear; var currentHour; var currentMinute; var calendarContentDiv; var returnDateTo; var returnFormat; var activeSelectBoxMonth; var activeSelectBoxYear; var activeSelectBoxHour; var activeSelectBoxMinute; var iframeObj = false; //// fix for EI frame problem on time dropdowns 09/30/2006 var iframeObj2 =false; function EIS_FIX_EI1(where2fixit) { if(!iframeObj2)return; iframeObj2.style.display = 'block'; iframeObj2.style.height =document.getElementById(where2fixit).offsetHeight+1; iframeObj2.style.width=document.getElementById(where2fixit).offsetWidth; iframeObj2.style.left=getleftPos(document.getElementById(where2fixit))+1-calendar_offsetLeft; iframeObj2.style.top=getTopPos(document.getElementById(where2fixit))-document.getElementById(where2fixit).offsetHeight-calendar_offsetTop; } function EIS_Hide_Frame() { if(iframeObj2)iframeObj2.style.display = 'none';} //// fix for EI frame problem on time dropdowns 09/30/2006 var returnDateToYear; var returnDateToMonth; var returnDateToDay; var returnDateToHour; var returnDateToMinute; var inputYear; var inputMonth; var inputDay; var inputHour; var inputMinute; var calendarDisplayTime = false; var selectBoxHighlightColor = '#D60808'; // Highlight color of select boxes var selectBoxRolloverBgColor = '#E2EBED'; // Background color on drop down lists(rollover) var selectBoxMovementInProgress = false; var activeSelectBox = false; function cancelCalendarEvent() { return false; } function isLeapYear(inputYear) { if(inputYear%400==0||(inputYear%4==0&&inputYear%100!=0)) return true; return false; } var activeSelectBoxMonth = false; var activeSelectBoxDirection = false; function highlightMonthYear() { if(activeSelectBoxMonth)activeSelectBoxMonth.className=''; activeSelectBox = this; if(this.className=='monthYearActive'){ this.className=''; }else{ this.className = 'monthYearActive'; activeSelectBoxMonth = this; } if(this.innerHTML.indexOf('-')>=0 || this.innerHTML.indexOf('+')>=0){ if(this.className=='monthYearActive') selectBoxMovementInProgress = true; else selectBoxMovementInProgress = false; if(this.innerHTML.indexOf('-')>=0)activeSelectBoxDirection = -1; else activeSelectBoxDirection = 1; }else selectBoxMovementInProgress = false; } function showMonthDropDown() { if(document.getElementById('monthDropDown').style.display=='block'){ document.getElementById('monthDropDown').style.display='none'; //// fix for EI frame problem on time dropdowns 09/30/2006 EIS_Hide_Frame(); }else{ document.getElementById('monthDropDown').style.display='block'; document.getElementById('yearDropDown').style.display='none'; document.getElementById('hourDropDown').style.display='none'; document.getElementById('minuteDropDown').style.display='none'; if (MSIE) { EIS_FIX_EI1('monthDropDown')} //// fix for EI frame problem on time dropdowns 09/30/2006 } } function showYearDropDown() { if(document.getElementById('yearDropDown').style.display=='block'){ document.getElementById('yearDropDown').style.display='none'; //// fix for EI frame problem on time dropdowns 09/30/2006 EIS_Hide_Frame(); }else{ document.getElementById('yearDropDown').style.display='block'; document.getElementById('monthDropDown').style.display='none'; document.getElementById('hourDropDown').style.display='none'; document.getElementById('minuteDropDown').style.display='none'; if (MSIE) { EIS_FIX_EI1('yearDropDown')} //// fix for EI frame problem on time dropdowns 09/30/2006 } } function showHourDropDown() { if(document.getElementById('hourDropDown').style.display=='block'){ document.getElementById('hourDropDown').style.display='none'; //// fix for EI frame problem on time dropdowns 09/30/2006 EIS_Hide_Frame(); }else{ document.getElementById('hourDropDown').style.display='block'; document.getElementById('monthDropDown').style.display='none'; document.getElementById('yearDropDown').style.display='none'; document.getElementById('minuteDropDown').style.display='none'; if (MSIE) { EIS_FIX_EI1('hourDropDown')} //// fix for EI frame problem on time dropdowns 09/30/2006 } } function showMinuteDropDown() { if(document.getElementById('minuteDropDown').style.display=='block'){ document.getElementById('minuteDropDown').style.display='none'; //// fix for EI frame problem on time dropdowns 09/30/2006 EIS_Hide_Frame(); }else{ document.getElementById('minuteDropDown').style.display='block'; document.getElementById('monthDropDown').style.display='none'; document.getElementById('yearDropDown').style.display='none'; document.getElementById('hourDropDown').style.display='none'; if (MSIE) { EIS_FIX_EI1('minuteDropDown')} //// fix for EI frame problem on time dropdowns 09/30/2006 } } function selectMonth() { document.getElementById('calendar_month_txt').innerHTML = this.innerHTML currentMonth = this.id.replace(/[^d]/g,''); document.getElementById('monthDropDown').style.display='none'; //// fix for EI frame problem on time dropdowns 09/30/2006 EIS_Hide_Frame(); for(var no=0;no<monthArray.length;no++){ document.getElementById('monthDiv_'+no).style.color=''; } this.style.color = selectBoxHighlightColor; activeSelectBoxMonth = this; writeCalendarContent(); } function selectHour() { document.getElementById('calendar_hour_txt').innerHTML = this.innerHTML currentHour = this.innerHTML.replace(/[^d]/g,''); document.getElementById('hourDropDown').style.display='none'; //// fix for EI frame problem on time dropdowns 09/30/2006 EIS_Hide_Frame(); if(activeSelectBoxHour){ activeSelectBoxHour.style.color=''; } activeSelectBoxHour=this; this.style.color = selectBoxHighlightColor; } function selectMinute() { document.getElementById('calendar_minute_txt').innerHTML = this.innerHTML currentMinute = this.innerHTML.replace(/[^d]/g,''); document.getElementById('minuteDropDown').style.display='none'; //// fix for EI frame problem on time dropdowns 09/30/2006 EIS_Hide_Frame(); if(activeSelectBoxMinute){ activeSelectBoxMinute.style.color=''; } activeSelectBoxMinute=this; this.style.color = selectBoxHighlightColor; } function selectYear() { document.getElementById('calendar_year_txt').innerHTML = this.innerHTML currentYear = this.innerHTML.replace(/[^d]/g,''); document.getElementById('yearDropDown').style.display='none'; //// fix for EI frame problem on time dropdowns 09/30/2006 EIS_Hide_Frame(); if(activeSelectBoxYear){ activeSelectBoxYear.style.color=''; } activeSelectBoxYear=this; this.style.color = selectBoxHighlightColor; writeCalendarContent(); } function switchMonth() { if(this.src.indexOf('left')>=0){ currentMonth=currentMonth-1;; if(currentMonth<0){ currentMonth=11; currentYear=currentYear-1; } }else{ currentMonth=currentMonth+1;; if(currentMonth>11){ currentMonth=0; currentYear=currentYear/1+1; } } writeCalendarContent(); } function createMonthDiv(){ var div = document.createElement('DIV'); div.className='monthYearPicker'; div.id = 'monthPicker'; for(var no=0;no<monthArray.length;no++){ var subDiv = document.createElement('DIV'); subDiv.innerHTML = monthArray[no]; subDiv.onmouseover = highlightMonthYear; subDiv.onmouseout = highlightMonthYear; subDiv.onclick = selectMonth; subDiv.id = 'monthDiv_' + no; subDiv.style.width = '56px'; subDiv.onselectstart = cancelCalendarEvent; div.appendChild(subDiv); if(currentMonth && currentMonth==no){ subDiv.style.color = selectBoxHighlightColor; activeSelectBoxMonth = subDiv; } } return div; } function changeSelectBoxYear(e,inputObj) { if(!inputObj)inputObj =this; var yearItems = inputObj.parentNode.getElementsByTagName('DIV'); if(inputObj.innerHTML.indexOf('-')>=0){ var startYear = yearItems[1].innerHTML/1 -1; if(activeSelectBoxYear){ activeSelectBoxYear.style.color=''; } }else{ var startYear = yearItems[1].innerHTML/1 +1; if(activeSelectBoxYear){ activeSelectBoxYear.style.color=''; } } for(var no=1;no<yearItems.length-1;no++){ yearItems[no].innerHTML = startYear+no-1; yearItems[no].id = 'yearDiv' + (startYear/1+no/1-1); } if(activeSelectBoxYear){ activeSelectBoxYear.style.color=''; if(document.getElementById('yearDiv'+currentYear)){ activeSelectBoxYear = document.getElementById('yearDiv'+currentYear); activeSelectBoxYear.style.color=selectBoxHighlightColor;; } } } function changeSelectBoxHour(e,inputObj) { if(!inputObj)inputObj = this; var hourItems = inputObj.parentNode.getElementsByTagName('DIV'); if(inputObj.innerHTML.indexOf('-')>=0){ var startHour = hourItems[1].innerHTML/1 -1; if(startHour<0)startHour=0; if(activeSelectBoxHour){ activeSelectBoxHour.style.color=''; } }else{ var startHour = hourItems[1].innerHTML/1 +1; if(startHour>14)startHour = 14; if(activeSelectBoxHour){ activeSelectBoxHour.style.color=''; } } var prefix = ''; for(var no=1;no<hourItems.length-1;no++){ if((startHour/1 + no/1) < 11)prefix = '0'; else prefix = ''; hourItems[no].innerHTML = prefix + (startHour+no-1); hourItems[no].id = 'hourDiv' + (startHour/1+no/1-1); } if(activeSelectBoxHour){ activeSelectBoxHour.style.color=''; if(document.getElementById('hourDiv'+currentHour)){ activeSelectBoxHour = document.getElementById('hourDiv'+currentHour); activeSelectBoxHour.style.color=selectBoxHighlightColor;; } } } function updateYearDiv() { var div = document.getElementById('yearDropDown'); var yearItems = div.getElementsByTagName('DIV'); for(var no=1;no<yearItems.length-1;no++){ yearItems[no].innerHTML = currentYear/1 -6 + no; if(currentYear==(currentYear/1 -6 + no)){ yearItems[no].style.color = selectBoxHighlightColor; activeSelectBoxYear = yearItems[no]; }else{ yearItems[no].style.color = ''; } } } function updateMonthDiv() { for(no=0;no<12;no++){ document.getElementById('monthDiv_' + no).style.color = ''; } document.getElementById('monthDiv_' + currentMonth).style.color = selectBoxHighlightColor; activeSelectBoxMonth = document.getElementById('monthDiv_' + currentMonth); } function updateHourDiv() { var div = document.getElementById('hourDropDown'); var hourItems = div.getElementsByTagName('DIV'); var addHours = 0; if((currentHour/1 -6 + 1)<0){ addHours = (currentHour/1 -6 + 1)*-1; } for(var no=1;no<hourItems.length-1;no++){ var prefix=''; if((currentHour/1 -6 + no + addHours) < 10)prefix='0'; hourItems[no].innerHTML = prefix + (currentHour/1 -6 + no + addHours); if(currentHour==(currentHour/1 -6 + no)){ hourItems[no].style.color = selectBoxHighlightColor; activeSelectBoxHour = hourItems[no]; }else{ hourItems[no].style.color = ''; } } } function updateMinuteDiv() { for(no=0;no<60;no+=intervalSelectBox_minutes){ var prefix = ''; if(no<10)prefix = '0'; document.getElementById('minuteDiv_' + prefix + no).style.color = ''; } if(document.getElementById('minuteDiv_' + currentMinute)){ document.getElementById('minuteDiv_' + currentMinute).style.color = selectBoxHighlightColor; activeSelectBoxMinute = document.getElementById('minuteDiv_' + currentMinute); } } function createYearDiv() { if(!document.getElementById('yearDropDown')){ var div = document.createElement('DIV'); div.className='monthYearPicker'; }else{ var div = document.getElementById('yearDropDown'); var subDivs = div.getElementsByTagName('DIV'); for(var no=0;no<subDivs.length;no++){ subDivs[no].parentNode.removeChild(subDivs[no]); } } var d = new Date(); if(currentYear){ d.setFullYear(currentYear); } var startYear = d.getFullYear()/1 - 5; var subDiv = document.createElement('DIV'); subDiv.innerHTML = ' - '; subDiv.onclick = changeSelectBoxYear; subDiv.onmouseover = highlightMonthYear; subDiv.onmouseout = function(){ selectBoxMovementInProgress = false;}; subDiv.onselectstart = cancelCalendarEvent; div.appendChild(subDiv); for(var no=startYear;no<(startYear+10);no++){ var subDiv = document.createElement('DIV'); subDiv.innerHTML = no; subDiv.onmouseover = highlightMonthYear; subDiv.onmouseout = highlightMonthYear; subDiv.onclick = selectYear; subDiv.id = 'yearDiv' + no; subDiv.onselectstart = cancelCalendarEvent; div.appendChild(subDiv); if(currentYear && currentYear==no){ subDiv.style.color = selectBoxHighlightColor; activeSelectBoxYear = subDiv; } } var subDiv = document.createElement('DIV'); subDiv.innerHTML = ' + '; subDiv.onclick = changeSelectBoxYear; subDiv.onmouseover = highlightMonthYear; subDiv.onmouseout = function(){ selectBoxMovementInProgress = false;}; subDiv.onselectstart = cancelCalendarEvent; div.appendChild(subDiv); return div; } /* This function creates the hour div at the bottom bar */ function slideCalendarSelectBox() { if(selectBoxMovementInProgress){ if(activeSelectBox.parentNode.id=='hourDropDown'){ changeSelectBoxHour(false,activeSelectBox); } if(activeSelectBox.parentNode.id=='yearDropDown'){ changeSelectBoxYear(false,activeSelectBox); } } setTimeout('slideCalendarSelectBox()',speedOfSelectBoxSliding); } function createHourDiv() { if(!document.getElementById('hourDropDown')){ var div = document.createElement('DIV'); div.className='monthYearPicker'; }else{ var div = document.getElementById('hourDropDown'); var subDivs = div.getElementsByTagName('DIV'); for(var no=0;no<subDivs.length;no++){ subDivs[no].parentNode.removeChild(subDivs[no]); } } if(!currentHour)currentHour=0; var startHour = currentHour/1; if(startHour>14)startHour=14; var subDiv = document.createElement('DIV'); subDiv.innerHTML = ' - '; subDiv.onclick = changeSelectBoxHour; subDiv.onmouseover = highlightMonthYear; subDiv.onmouseout = function(){ selectBoxMovementInProgress = false;}; subDiv.onselectstart = cancelCalendarEvent; div.appendChild(subDiv); for(var no=startHour;no<startHour+10;no++){ var prefix = ''; if(no/1<10)prefix='0'; var subDiv = document.createElement('DIV'); subDiv.innerHTML = prefix + no; subDiv.onmouseover = highlightMonthYear; subDiv.onmouseout = highlightMonthYear; subDiv.onclick = selectHour; subDiv.id = 'hourDiv' + no; subDiv.onselectstart = cancelCalendarEvent; div.appendChild(subDiv); if(currentYear && currentYear==no){ subDiv.style.color = selectBoxHighlightColor; activeSelectBoxYear = subDiv; } } var subDiv = document.createElement('DIV'); subDiv.innerHTML = ' + '; subDiv.onclick = changeSelectBoxHour; subDiv.onmouseover = highlightMonthYear; subDiv.onmouseout = function(){ selectBoxMovementInProgress = false;}; subDiv.onselectstart = cancelCalendarEvent; div.appendChild(subDiv); return div; } /* This function creates the minute div at the bottom bar */ function createMinuteDiv() { if(!document.getElementById('minuteDropDown')){ var div = document.createElement('DIV'); div.className='monthYearPicker'; }else{ var div = document.getElementById('minuteDropDown'); var subDivs = div.getElementsByTagName('DIV'); for(var no=0;no<subDivs.length;no++){ subDivs[no].parentNode.removeChild(subDivs[no]); } } var startMinute = 0; var prefix = ''; for(var no=startMinute;no<60;no+=intervalSelectBox_minutes){ if(no<10)prefix='0'; else prefix = ''; var subDiv = document.createElement('DIV'); subDiv.innerHTML = prefix + no; subDiv.onmouseover = highlightMonthYear; subDiv.onmouseout = highlightMonthYear; subDiv.onclick = selectMinute; subDiv.id = 'minuteDiv_' + prefix + no; subDiv.onselectstart = cancelCalendarEvent; div.appendChild(subDiv); if(currentYear && currentYear==no){ subDiv.style.color = selectBoxHighlightColor; activeSelectBoxYear = subDiv; } } return div; } function highlightSelect() { if(this.className=='selectBoxTime'){ this.className = 'selectBoxTimeOver'; this.getElementsByTagName('IMG')[0].src = pathToImages + 'down_time_over.gif'; }else if(this.className=='selectBoxTimeOver'){ this.className = 'selectBoxTime'; this.getElementsByTagName('IMG')[0].src = pathToImages + 'down_time.gif'; } if(this.className=='selectBox'){ this.className = 'selectBoxOver'; this.getElementsByTagName('IMG')[0].src = pathToImages + 'down_over.gif'; }else if(this.className=='selectBoxOver'){ this.className = 'selectBox'; this.getElementsByTagName('IMG')[0].src = pathToImages + 'down.gif'; } } function highlightArrow() { if(this.src.indexOf('over')>=0){ if(this.src.indexOf('left')>=0)this.src = pathToImages + 'left.gif'; if(this.src.indexOf('right')>=0)this.src = pathToImages + 'right.gif'; }else{ if(this.src.indexOf('left')>=0)this.src = pathToImages + 'left_over.gif'; if(this.src.indexOf('right')>=0)this.src = pathToImages + 'right_over.gif'; } } function highlightClose() { if(this.src.indexOf('over')>=0){ this.src = pathToImages + 'close.gif'; }else{ this.src = pathToImages + 'close_over.gif'; } } function closeCalendar(){ document.getElementById('yearDropDown').style.display='none'; document.getElementById('monthDropDown').style.display='none'; document.getElementById('hourDropDown').style.display='none'; document.getElementById('minuteDropDown').style.display='none'; calendarDiv.style.display='none'; if(iframeObj){ iframeObj.style.display='none'; //// //// fix for EI frame problem on time dropdowns 09/30/2006 EIS_Hide_Frame();} if(activeSelectBoxMonth)activeSelectBoxMonth.className=''; if(activeSelectBoxYear)activeSelectBoxYear.className=''; } function writeTopBar() { var topBar = document.createElement('DIV'); topBar.className = 'topBar'; topBar.id = 'topBar'; calendarDiv.appendChild(topBar); // Left arrow var leftDiv = document.createElement('DIV'); leftDiv.style.marginRight = '1px'; var img = document.createElement('IMG'); img.src = pathToImages + 'left.gif'; img.onmouseover = highlightArrow; img.onclick = switchMonth; img.onmouseout = highlightArrow; leftDiv.appendChild(img); topBar.appendChild(leftDiv); if(Opera)leftDiv.style.width = '16px'; // Right arrow var rightDiv = document.createElement('DIV'); rightDiv.style.marginRight = '1px'; var img = document.createElement('IMG'); img.src = pathToImages + 'right.gif'; img.onclick = switchMonth; img.onmouseover = highlightArrow; img.onmouseout = highlightArrow; rightDiv.appendChild(img); if(Opera)rightDiv.style.width = '16px'; topBar.appendChild(rightDiv); // Month selector var monthDiv = document.createElement('DIV'); monthDiv.id = 'monthSelect'; monthDiv.onmouseover = highlightSelect; monthDiv.onmouseout = highlightSelect; monthDiv.onclick = showMonthDropDown; var span = document.createElement('SPAN'); span.innerHTML = monthArray[currentMonth]; span.id = 'calendar_month_txt'; monthDiv.appendChild(span); var img = document.createElement('IMG'); img.src = pathToImages + 'down.gif'; img.style.position = 'absolute'; img.style.right = '0px'; monthDiv.appendChild(img); monthDiv.className = 'selectBox'; if(Opera){ img.style.cssText = 'float:right;position:relative'; img.style.position = 'relative'; img.style.styleFloat = 'right'; } topBar.appendChild(monthDiv); var monthPicker = createMonthDiv(); monthPicker.style.left = '37px'; monthPicker.style.top = monthDiv.offsetTop + monthDiv.offsetHeight + 1 + 'px'; monthPicker.style.width ='60px'; monthPicker.id = 'monthDropDown'; calendarDiv.appendChild(monthPicker); // Year selector var yearDiv = document.createElement('DIV'); yearDiv.onmouseover = highlightSelect; yearDiv.onmouseout = highlightSelect; yearDiv.onclick = showYearDropDown; var span = document.createElement('SPAN'); span.innerHTML = currentYear; span.id = 'calendar_year_txt'; yearDiv.appendChild(span); topBar.appendChild(yearDiv); var img = document.createElement('IMG'); img.src = pathToImages + 'down.gif'; yearDiv.appendChild(img); yearDiv.className = 'selectBox'; if(Opera){ yearDiv.style.width = '50px'; img.style.cssText = 'float:right'; img.style.position = 'relative'; img.style.styleFloat = 'right'; } var yearPicker = createYearDiv(); yearPicker.style.left = '113px'; yearPicker.style.top = monthDiv.offsetTop + monthDiv.offsetHeight + 1 + 'px'; yearPicker.style.width = '35px'; yearPicker.id = 'yearDropDown'; calendarDiv.appendChild(yearPicker); var img = document.createElement('IMG'); img.src = pathToImages + 'close.gif'; img.style.styleFloat = 'right'; img.onmouseover = highlightClose; img.onmouseout = highlightClose; img.onclick = closeCalendar; topBar.appendChild(img); if(!document.all){ img.style.position = 'absolute'; img.style.right = '2px'; } } function writeCalendarContent() { var calendarContentDivExists = true; if(!calendarContentDiv){ calendarContentDiv = document.createElement('DIV'); calendarDiv.appendChild(calendarContentDiv); calendarContentDivExists = false; } currentMonth = currentMonth/1; var d = new Date(); d.setFullYear(currentYear); d.setDate(1); d.setMonth(currentMonth); var dayStartOfMonth = d.getDay(); if(dayStartOfMonth==0)dayStartOfMonth=7; dayStartOfMonth--; document.getElementById('calendar_year_txt').innerHTML = currentYear; document.getElementById('calendar_month_txt').innerHTML = monthArray[currentMonth]; document.getElementById('calendar_hour_txt').innerHTML = currentHour; document.getElementById('calendar_minute_txt').innerHTML = currentMinute; var existingTable = calendarContentDiv.getElementsByTagName('TABLE'); if(existingTable.length>0){ calendarContentDiv.removeChild(existingTable[0]); } var calTable = document.createElement('TABLE'); calTable.width = '100%'; calTable.cellSpacing = '0'; calendarContentDiv.appendChild(calTable); var calTBody = document.createElement('TBODY'); calTable.appendChild(calTBody); var row = calTBody.insertRow(-1); row.className = 'calendar_week_row'; var cell = row.insertCell(-1); cell.innerHTML = weekString; cell.className = 'calendar_week_column'; cell.style.backgroundColor = selectBoxRolloverBgColor; for(var no=0;no<dayArray.length;no++){ var cell = row.insertCell(-1); cell.innerHTML = dayArray[no]; } var row = calTBody.insertRow(-1); var cell = row.insertCell(-1); cell.className = 'calendar_week_column'; cell.style.backgroundColor = selectBoxRolloverBgColor; var week = getWeek(currentYear,currentMonth,1); cell.innerHTML = week; // Week for(var no=0;no<dayStartOfMonth;no++){ var cell = row.insertCell(-1); cell.innerHTML = ' '; } var colCounter = dayStartOfMonth; var daysInMonth = daysInMonthArray[currentMonth]; if(daysInMonth==28){ if(isLeapYear(currentYear))daysInMonth=29; } for(var no=1;no<=daysInMonth;no++){ d.setDate(no-1); if(colCounter>0 && colCounter%7==0){ var row = calTBody.insertRow(-1); var cell = row.insertCell(-1); cell.className = 'calendar_week_column'; var week = getWeek(currentYear,currentMonth,no); cell.innerHTML = week; // Week cell.style.backgroundColor = selectBoxRolloverBgColor; } var cell = row.insertCell(-1); if(currentYear==inputYear && currentMonth == inputMonth && no==inputDay){ cell.className='activeDay'; } cell.innerHTML = no; cell.onclick = pickDate; colCounter++; } if(!document.all){ if(calendarContentDiv.offsetHeight) document.getElementById('topBar').style.top = calendarContentDiv.offsetHeight + document.getElementById('timeBar').offsetHeight + document.getElementById('topBar').offsetHeight -1 + 'px'; else{ document.getElementById('topBar').style.top = ''; document.getElementById('topBar').style.bottom = '0px'; } } if(iframeObj){ if(!calendarContentDivExists)setTimeout('resizeIframe()',350);else setTimeout('resizeIframe()',10); } } function resizeIframe() { iframeObj.style.width = calendarDiv.offsetWidth + 'px'; iframeObj.style.height = calendarDiv.offsetHeight + 'px' ; } function pickTodaysDate() { var d = new Date(); currentMonth = d.getMonth(); currentYear = d.getFullYear(); pickDate(false,d.getDate()); } function pickDate(e,inputDay) { var month = currentMonth/1 +1; if(month<10)month = '0' + month; var day; if(!inputDay && this)day = this.innerHTML; else day = inputDay; if(day/1<10)day = '0' + day; if(returnFormat){ returnFormat = returnFormat.replace('dd',day); returnFormat = returnFormat.replace('mm',month); returnFormat = returnFormat.replace('yyyy',currentYear); returnFormat = returnFormat.replace('hh',currentHour); returnFormat = returnFormat.replace('ii',currentMinute); returnFormat = returnFormat.replace('d',day/1); returnFormat = returnFormat.replace('m',month/1); returnDateTo.value = returnFormat; try{ returnDateTo.onchange(); }catch(e){ } }else{ for(var no=0;no<returnDateToYear.options.length;no++){ if(returnDateToYear.options[no].value==currentYear){ returnDateToYear.selectedIndex=no; break; } } for(var no=0;no<returnDateToMonth.options.length;no++){ if(returnDateToMonth.options[no].value==month){ returnDateToMonth.selectedIndex=no; break; } } for(var no=0;no<returnDateToDay.options.length;no++){ if(returnDateToDay.options[no].value==day){ returnDateToDay.selectedIndex=no; break; } } if(calendarDisplayTime){ for(var no=0;no<returnDateToHour.options.length;no++){ if(returnDateToHour.options[no].value==currentHour){ returnDateToHour.selectedIndex=no; break; } } for(var no=0;no<returnDateToMinute.options.length;no++){ if(returnDateToMinute.options[no].value==currentMinute){ returnDateToMinute.selectedIndex=no; break; } } } } closeCalendar(); } // This function is from http://www.codeproject.com/csharp/gregorianwknum.asp // Only changed the month add function getWeek(year,month,day){ day = day/1; year = year /1; month = month/1 + 1; //use 1-12 var a = Math.floor((14-(month))/12); var y = year+4800-a; var m = (month)+(12*a)-3; var jd = day + Math.floor(((153*m)+2)/5) + (365*y) + Math.floor(y/4) - Math.floor(y/100) + Math.floor(y/400) - 32045; // (gregorian calendar) var d4 = (jd+31741-(jd%7))%146097%36524%1461; var L = Math.floor(d4/1460); var d1 = ((d4-L)%365)+L; NumberOfWeek = Math.floor(d1/7) + 1; return NumberOfWeek; } function writeTimeBar() { var timeBar = document.createElement('DIV'); timeBar.id = 'timeBar'; timeBar.className = 'timeBar'; var subDiv = document.createElement('DIV'); subDiv.innerHTML = 'Time:'; //timeBar.appendChild(subDiv); // Year selector var hourDiv = document.createElement('DIV'); hourDiv.onmouseover = highlightSelect; hourDiv.onmouseout = highlightSelect; hourDiv.onclick = showHourDropDown; hourDiv.style.width = '30px'; var span = document.createElement('SPAN'); span.innerHTML = currentHour; span.id = 'calendar_hour_txt'; hourDiv.appendChild(span); timeBar.appendChild(hourDiv); var img = document.createElement('IMG'); img.src = pathToImages + 'down_time.gif'; hourDiv.appendChild(img); hourDiv.className = 'selectBoxTime'; if(Opera){ hourDiv.style.width = '30px'; img.style.cssText = 'float:right'; img.style.position = 'relative'; img.style.styleFloat = 'right'; } var hourPicker = createHourDiv(); hourPicker.style.left = '130px'; //hourPicker.style.top = monthDiv.offsetTop + monthDiv.offsetHeight + 1 + 'px'; hourPicker.style.width = '35px'; hourPicker.id = 'hourDropDown'; calendarDiv.appendChild(hourPicker); // Add Minute picker // Year selector var minuteDiv = document.createElement('DIV'); minuteDiv.onmouseover = highlightSelect; minuteDiv.onmouseout = highlightSelect; minuteDiv.onclick = showMinuteDropDown; minuteDiv.style.width = '30px'; var span = document.createElement('SPAN'); span.innerHTML = currentMinute; span.id = 'calendar_minute_txt'; minuteDiv.appendChild(span); timeBar.appendChild(minuteDiv); var img = document.createElement('IMG'); img.src = pathToImages + 'down_time.gif'; minuteDiv.appendChild(img); minuteDiv.className = 'selectBoxTime'; if(Opera){ minuteDiv.style.width = '30px'; img.style.cssText = 'float:right'; img.style.position = 'relative'; img.style.styleFloat = 'right'; } var minutePicker = createMinuteDiv(); minutePicker.style.left = '167px'; //minutePicker.style.top = monthDiv.offsetTop + monthDiv.offsetHeight + 1 + 'px'; minutePicker.style.width = '35px'; minutePicker.id = 'minuteDropDown'; calendarDiv.appendChild(minutePicker); return timeBar; } function writeBottomBar() { var d = new Date(); var bottomBar = document.createElement('DIV'); bottomBar.id = 'bottomBar'; bottomBar.style.cursor = 'pointer'; bottomBar.className = 'todaysDate'; // var todayStringFormat = '[todayString] [dayString] [day] [monthString] [year]'; ;; var subDiv = document.createElement('DIV'); subDiv.onclick = pickTodaysDate; subDiv.id = 'todaysDateString'; subDiv.style.width = (calendarDiv.offsetWidth - 95) + 'px'; var day = d.getDay(); if(day==0)day = 7; day--; var bottomString = todayStringFormat; bottomString = bottomString.replace('[monthString]',monthArrayShort[d.getMonth()]); bottomString = bottomString.replace('[day]',d.getDate()); bottomString = bottomString.replace('[year]',d.getFullYear()); bottomString = bottomString.replace('[dayString]',dayArray[day].toLowerCase()); bottomString = bottomString.replace('[UCFdayString]',dayArray[day]); bottomString = bottomString.replace('[todayString]',todayString); subDiv.innerHTML = todayString + ': ' + d.getDate() + '. ' + monthArrayShort[d.getMonth()] + ', ' + d.getFullYear() ; subDiv.innerHTML = bottomString ; bottomBar.appendChild(subDiv); var timeDiv = writeTimeBar(); bottomBar.appendChild(timeDiv); calendarDiv.appendChild(bottomBar); } function getTopPos(inputObj) { var returnValue = inputObj.offsetTop + inputObj.offsetHeight; while((inputObj = inputObj.offsetParent) != null)returnValue += inputObj.offsetTop; return returnValue + calendar_offsetTop; } function getleftPos(inputObj) { var returnValue = inputObj.offsetLeft; while((inputObj = inputObj.offsetParent) != null)returnValue += inputObj.offsetLeft; return returnValue + calendar_offsetLeft; } function positionCalendar(inputObj) { calendarDiv.style.left = getleftPos(inputObj) + 'px'; calendarDiv.style.top = getTopPos(inputObj) + 'px'; if(iframeObj){ iframeObj.style.left = calendarDiv.style.left; iframeObj.style.top = calendarDiv.style.top; //// fix for EI frame problem on time dropdowns 09/30/2006 iframeObj2.style.left = calendarDiv.style.left; iframeObj2.style.top = calendarDiv.style.top; } } function initCalendar() { if(MSIE){ iframeObj = document.createElement('IFRAME'); iframeObj.style.filter = 'alpha(opacity=0)'; iframeObj.style.position = 'absolute'; iframeObj.border='0px'; iframeObj.style.border = '0px'; iframeObj.style.backgroundColor = '#FF0000'; //// fix for EI frame problem on time dropdowns 09/30/2006 iframeObj2 = document.createElement('IFRAME'); iframeObj2.style.position = 'absolute'; iframeObj2.border='0px'; iframeObj2.style.border = '0px'; iframeObj2.style.height = '1px'; iframeObj2.style.width = '1px'; document.body.appendChild(iframeObj2); //// fix for EI frame problem on time dropdowns 09/30/2006 // Added fixed for HTTPS iframeObj2.src = 'blank.html'; iframeObj.src = 'blank.html'; document.body.appendChild(iframeObj); } calendarDiv = document.createElement('DIV'); calendarDiv.id = 'calendarDiv'; calendarDiv.style.zIndex = 1000; slideCalendarSelectBox(); document.body.appendChild(calendarDiv); writeBottomBar(); writeTopBar(); if(!currentYear){ var d = new Date(); currentMonth = d.getMonth(); currentYear = d.getFullYear(); } writeCalendarContent(); } function setTimeProperties() { if(!calendarDisplayTime){ document.getElementById('timeBar').style.display='none'; document.getElementById('timeBar').style.visibility='hidden'; document.getElementById('todaysDateString').style.width = '100%'; }else{ document.getElementById('timeBar').style.display='block'; document.getElementById('timeBar').style.visibility='visible'; document.getElementById('hourDropDown').style.top = document.getElementById('calendar_minute_txt').parentNode.offsetHeight + calendarContentDiv.offsetHeight + document.getElementById('topBar').offsetHeight + 'px'; document.getElementById('minuteDropDown').style.top = document.getElementById('calendar_minute_txt').parentNode.offsetHeight + calendarContentDiv.offsetHeight + document.getElementById('topBar').offsetHeight + 'px'; document.getElementById('minuteDropDown').style.right = '50px'; document.getElementById('hourDropDown').style.right = '50px'; document.getElementById('todaysDateString').style.width = '115px'; } } function calendarSortItems(a,b) { return a/1 - b/1; } function displayCalendar(inputField,format,buttonObj,displayTime,timeInput) { if(displayTime)calendarDisplayTime=true; else calendarDisplayTime = false; if(inputField.value.length>0){ if(!format.match(/^[0-9]*?$/gi)){ var items = inputField.value.split(/[^0-9]/gi); var positionArray = new Array(); positionArray['m'] = format.indexOf('mm'); if(positionArray['m']==-1)positionArray['m'] = format.indexOf('m'); positionArray['d'] = format.indexOf('dd'); if(positionArray['d']==-1)positionArray['d'] = format.indexOf('d'); positionArray['y'] = format.indexOf('yyyy'); positionArray['h'] = format.indexOf('hh'); positionArray['i'] = format.indexOf('ii'); var positionArrayNumeric = Array(); positionArrayNumeric[0] = positionArray['m']; positionArrayNumeric[1] = positionArray['d']; positionArrayNumeric[2] = positionArray['y']; positionArrayNumeric[3] = positionArray['h']; positionArrayNumeric[4] = positionArray['i']; positionArrayNumeric = positionArrayNumeric.sort(calendarSortItems); var itemIndex = -1; currentHour = '00'; currentMinute = '00'; for(var no=0;no<positionArrayNumeric.length;no++){ if(positionArrayNumeric[no]==-1)continue; itemIndex++; if(positionArrayNumeric[no]==positionArray['m']){ currentMonth = items[itemIndex]-1; continue; } if(positionArrayNumeric[no]==positionArray['y']){ currentYear = items[itemIndex]; continue; } if(positionArrayNumeric[no]==positionArray['d']){ tmpDay = items[itemIndex]; continue; } if(positionArrayNumeric[no]==positionArray['h']){ currentHour = items[itemIndex]; continue; } if(positionArrayNumeric[no]==positionArray['i']){ currentMinute = items[itemIndex]; continue; } } currentMonth = currentMonth / 1; tmpDay = tmpDay / 1; }else{ var monthPos = format.indexOf('mm'); currentMonth = inputField.value.substr(monthPos,2)/1 -1; var yearPos = format.indexOf('yyyy'); currentYear = inputField.value.substr(yearPos,4); var dayPos = format.indexOf('dd'); tmpDay = inputField.value.substr(dayPos,2); var hourPos = format.indexOf('hh'); if(hourPos>=0){ tmpHour = inputField.value.substr(hourPos,2); currentHour = tmpHour; }else{ currentHour = '00'; } var minutePos = format.indexOf('ii'); if(minutePos>=0){ tmpMinute = inputField.value.substr(minutePos,2); currentMinute = tmpMinute; }else{ currentMinute = '00'; } } }else{ var d = new Date(); currentMonth = d.getMonth(); currentYear = d.getFullYear(); currentHour = '08'; currentMinute = '00'; tmpDay = d.getDate(); } inputYear = currentYear; inputMonth = currentMonth; inputDay = tmpDay/1; if(!calendarDiv){ initCalendar(); }else{ if(calendarDiv.style.display=='block'){ closeCalendar(); return false; } writeCalendarContent(); } returnFormat = format; returnDateTo = inputField; positionCalendar(buttonObj); calendarDiv.style.visibility = 'visible'; calendarDiv.style.display = 'block'; if(iframeObj){ iframeObj.style.display = ''; iframeObj.style.height = '140px'; iframeObj.style.width = '195px'; iframeObj2.style.display = ''; iframeObj2.style.height = '140px'; iframeObj2.style.width = '195px'; } setTimeProperties(); updateYearDiv(); updateMonthDiv(); updateMinuteDiv(); updateHourDiv(); } function displayCalendarSelectBox(yearInput,monthInput,dayInput,hourInput,minuteInput,buttonObj) { if(!hourInput)calendarDisplayTime=false; else calendarDisplayTime = true; currentMonth = monthInput.options[monthInput.selectedIndex].value/1-1; currentYear = yearInput.options[yearInput.selectedIndex].value; if(hourInput){ currentHour = hourInput.options[hourInput.selectedIndex].value; inputHour = currentHour/1; } if(minuteInput){ currentMinute = minuteInput.options[minuteInput.selectedIndex].value; inputMinute = currentMinute/1; } inputYear = yearInput.options[yearInput.selectedIndex].value; inputMonth = monthInput.options[monthInput.selectedIndex].value/1 - 1; inputDay = dayInput.options[dayInput.selectedIndex].value/1; if(!calendarDiv){ initCalendar(); }else{ writeCalendarContent(); } returnDateToYear = yearInput; returnDateToMonth = monthInput; returnDateToDay = dayInput; returnDateToHour = hourInput; returnDateToMinute = minuteInput; returnFormat = false; returnDateTo = false; positionCalendar(buttonObj); calendarDiv.style.visibility = 'visible'; calendarDiv.style.display = 'block'; if(iframeObj){ iframeObj.style.display = ''; iframeObj.style.height = calendarDiv.offsetHeight + 'px'; iframeObj.style.width = calendarDiv.offsetWidth + 'px'; //// fix for EI frame problem on time dropdowns 09/30/2006 iframeObj2.style.display = ''; iframeObj2.style.height = calendarDiv.offsetHeight + 'px'; iframeObj2.style.width = calendarDiv.offsetWidth + 'px' } setTimeProperties(); updateYearDiv(); updateMonthDiv(); updateHourDiv(); updateMinuteDiv(); } 打包文件下载

  推荐阅读

  JavaScript与函数式编程解释

作者:月影 牢记:函数式编程不是用函数来编程!!!23.4函数式编程 23.4.1 什么是函数式编程 什么是函数式编程?如果你这么直白地询问,会发现它竟是一个不太容易解释的概念。许多在程序设计领域有着多年>>>详细阅读


本文标题:javascript英文日期(有时间)选择器

地址:http://www.17bianji.com/kaifa2/JS/30519.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)