Помогите пожалуйста создать JavaScript часы выводящие определенный часовой пояс.

Question

Помогите пожалуйста создать JavaScript часы выводящие определенный часовой пояс.

Рейтинг: 0Ответов: 2Опубликовано: 24.01.2015

Помогите пожалуйста создать JavaScript часы выводящие определенный часовой пояс например московский, заранее спасибо.

javascript

Источник: Stack Overflow на русском

Answer 1

▲ 1

Мой вариант часов на js: ссылка. Посмотрите там код и demo.

Выводит текущее время, каждую секунду время корректируется за счёт рекурсивного вызова setTimeout.

Код в самом простом варианте, html:

<div id="timeLocation"></div>

js:

var locale_time_start = new Date(); /*get locale time*/

function showTime() {
    var locale_time = new Date(); /*get locale time*/
    var dH=''+locale_time.getHours();dH=dH.length<2?'0'+dH:dH;
    var dM=''+locale_time.getMinutes();dM=dM.length<2?'0'+dM:dM;
    var dS=''+locale_time.getSeconds();dS=dS.length<2?'0'+dS:dS;
    var tmp=dH+':'+dM+':'+dS;
    document.getElementById('timeLocation').innerHTML=tmp;
    var t=setTimeout('showTime()',1000); /*рекурсивный вызов каждую сек. для корректировки времени*/
}

showTime(); /*выполняем ф-ю вывода времени*/

Если вам нужно время по Москве, то нужно заранее время отдавать с сервера в js, т.к. на клиенте время будет зависеть от настройки времени и часового пояса в браузере или ОС. На одном Javascript по идее нельзя точно показать время по определённому часовому поясу, т.к. js возвращает время относительно настроенного часового пояса (а он может быть настроен неверно) и не может знать серверное время.

Answer 2

▲ 0

<html>
<head>
<title>Время в разных городах.</title>
<style type="text/css">
<!--
.timestyle { position:absolute; left:100px; top:100px; font-size:8pt; color:#ffff00; background-color:#006600; }
-->
</style>
<script language=javaScript>
<!--// Beginning of JavaScript -
var worldtime = new Array()
worldtime[0]="London,0"
worldtime[1]="Berlin,1"
worldtime[2]="Paris,1"
worldtime[3]="Johannesburg,2"
worldtime[4]="Kairo,2"
worldtime[5]="Baghdad,3"
worldtime[6]="Moscow,4"
worldtime[7]="Beijing,8"
worldtime[8]="Hong Kong,8"
worldtime[9]="Perth,8"
worldtime[10]="Tokyo,9"
worldtime[11]="Sydney,11"
worldtime[12]="Azores,-1"
worldtime[13]="Rio de Janheiro,-2"
worldtime[14]="Buenos Aires,-3"
worldtime[15]="Lima,-5"
worldtime[16]="New York,-5"
worldtime[17]="Chicago,-6"
worldtime[18]="Mexico City,-6"
worldtime[19]="Denver,-7"
worldtime[20]="San Francisco,-8"
worldtime[20]="Honolulu,-10"

var hours
var shifthours
var minutes
var seconds
var localhours
var pause=2000
var thisplace
var thisline=""
var showmenu=1

function showtime() {

 for (i=0; i<=worldtime.length-1;i++) {
  thisplace=worldtime[i].split(",")
  thistime= new Date()
  hours=thistime.getUTCHours()
  hours=eval(hours)
  shifthours=eval(thisplace[1])
  localhours=eval(shifthours+hours)
  if (localhours <0) {localhours=24+localhours}
  if (localhours >=24) {localhours=localhours-24}

  minutes=thistime.getUTCMinutes()
  seconds=thistime.getUTCSeconds()

  if (thisplace[0]=='Delhi') {
   minutes=eval(minutes+30)
   if (minutes>=60) {
    minutes=eval(minutes-60)
    localhours=eval(localhours+1)
   }
  }
  if (eval(minutes) < 10) {minutes="0"+minutes}
  if (eval(seconds) < 10) {seconds="0"+seconds}
  if (eval(localhours) < 10) {localhours="0"+localhours}
  thisline+=localhours+":"+minutes+":"+seconds+" "+thisplace[0]+"<br>"
 }
 if (document.all) {
  timediv.innerHTML=thisline
  thisline=""
  var timer=setTimeout("showtime()",1000)
 }
 if (document.layers) {
  document.timediv.document.write("<span id='nn' class='timestyle'>")
  document.timediv.document.write(thisline)
  document.timediv.document.write("</span>")
  document.timediv.document.close()
  thisline=""
 }
}

function dblclick() {
 if (document.all && showmenu==1) {
  document.all.timediv.style.visibility="visible"
  document.all.timediv.style.posLeft=x
  document.all.timediv.style.posTop=y
  showtime()
 }
 if (document.layers && showmenu==1) {
  document.timediv.visibility="visible"
  document.timediv.left=x-40
  document.timediv.top=y-80
  showtime()
 }
 if (document.all && showmenu!=1) {
  document.all.timediv.style.visibility="hidden"
 }
 if (document.layers && showmenu!=1) {
  document.timediv.visibility="hidden"
 }
 showmenu=showmenu*-1
}


if (document.layers) {
document.captureEvents(Event.ONDBLCLICK);
}
document.ondblclick=dblclick;

if (document.layers){
 document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = handlerMM;

function handlerMM(e){
 x = (document.layers) ? e.pageX : event.clientX
 y = (document.layers) ? e.pageY : event.clientY
}

// - End of JavaScript - -->
</script>
</head>
<body>
<div id="timediv" class="timestyle"></div>
</body>
</html>

В любых часах можешь задать какое-то время отличное от твоего домашнего, это и будет разница часового пояса.

Помогите пожалуйста создать JavaScript часы выводящие определенный часовой пояс.

Ответы