Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 16.01.2018, 11:01
Аватар для LADYX
Профессор
Отправить личное сообщение для LADYX Посмотреть профиль Найти все сообщения от LADYX
 
Регистрация: 19.02.2015
Сообщений: 219

Как вывести время в разных городах?
Добрый день! Есть скрипт часов и вкладок для разных городов. Сейчас часы показывают московское время во вкладке для этого города. Подскажите, пожалуйста, как правильно вывести время для других городов, и подключить при выборе города/вкладки Cookie? jQuery Cookie Plugin v1.4.1 (http://plugins.jquery.com/cookie/) к сайту подключен. Спасибо!
var moskowUtc = 3;
var timerId = setInterval(function() {
  let t = new Date(),
    tt = t.getUTCHours() + moskowUtc;
  document.getElementById('tik-tak-moscow').innerHTML = (tt > 24 ? "0" : "") + (tt > 24 ? tt - 24 : tt) + ":" + (t.getMinutes() < 10 ? '0' : '') + t.getMinutes() + ":" + (t.getSeconds() < 10 ? '0' : '') + t.getSeconds();
  document.getElementById('tik-tak-moscow').classList.add("step");
}, 1000);

$(function() {
  $("#tik-tak-tabs").on("click", ".tik-tak-tab", function() {
    var tabs = $("#tik-tak-tabs .tik-tak-tab"),
      cont = $("#tik-tak-tabs .tik-tak-wrp-tab");
    tabs.removeClass("active");
    cont.removeClass("active");
    $(this).addClass("active");
    cont.eq($(this).index()).addClass("active");
    return false;
  });
});

<style>#tik-tak-tabs .tik-tak-select>span {
  display: inline-block;
  margin: 0 10px 30px 0;
  cursor: pointer;
}

#tik-tak-tabs .tik-tak-wrp .tik-tak-wrp-tab>i {
  display: block;
  margin-top: 2px;
}

#tik-tak-tabs .tik-tak-wrp .tik-tak-wrp-tab {
  display: none;
}

#tik-tak-tabs .tik-tak-wrp .tik-tak-wrp-tab.active {
  display: block;
}
</style>
<div id="tik-tak-tabs">
  <div class="tik-tak-select">
    <span class="tik-tak-tab tik-tak-moscow">Москва</span>
    <span class="tik-tak-tab tik-tak-london">Лондон</span>
    <span class="tik-tak-tab tik-tak-new_york">Нью Йорк</span>
    <span class="tik-tak-tab tik-tak-tokyo">Токио</span>
  </div>
  <div class="tik-tak-wrp">
    <div class="tik-tak-wrp-tab active"><span id="tik-tak-moscow"></span><i>Москва</i></div>
    <div class="tik-tak-wrp-tab"><span id="tik-tak-london"></span><i>Лондон</i></div>
    <div class="tik-tak-wrp-tab"><span id="tik-tak-new_york"></span><i>Нью Йорк</i></div>
    <div class="tik-tak-wrp-tab"><span id="tik-tak-tokyo"></span><i>Токио</i></div>
  </div>
</div>
Ответить с цитированием
  #2 (permalink)  
Старый 16.01.2018, 12:18
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

LADYX,
http://geohelper.info/ru
Ответить с цитированием
  #3 (permalink)  
Старый 16.01.2018, 12:42
Аватар для LADYX
Профессор
Отправить личное сообщение для LADYX Посмотреть профиль Найти все сообщения от LADYX
 
Регистрация: 19.02.2015
Сообщений: 219

Dilettante_Pro,
Сообщение от Dilettante_Pro
LADYX,
http://geohelper.info/ru
нет, мне не нужен этот сервис
Ответить с цитированием
  #4 (permalink)  
Старый 16.01.2018, 13:34
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

время в разных городах c сохранением выбора
LADYX,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
  var obj = {timeZone:"Europe/Moscow"}, timer, tz = window.localStorage.getItem("tz") || 0;
  function tic() {
    var date = new Date;
    $(".tik-tak-wrp-tab.active span").text(date.toLocaleTimeString("ru", obj));
    timer = window.setTimeout(tic, 1000);
  }
  tic();
  var tabs = $("#tik-tak-tabs .tik-tak-tab"), cont = $("#tik-tak-tabs .tik-tak-wrp-tab");
  $("#tik-tak-tabs").on("click", ".tik-tak-tab", function() {
    tabs.removeClass("active");
    cont.removeClass("active");
    var indx = $(this).index();
    window.localStorage.setItem("tz",indx);
    cont.eq(indx).addClass("active");
    obj.timeZone = $(this).addClass("active").data("timezone");
    window.clearTimeout(timer);
    tic();
    return false;
  });
  tabs.eq(tz).trigger("click");
});
  </script>
</head>

<body>
<style>#tik-tak-tabs .tik-tak-select>span {
  display: inline-block;
  margin: 0 10px 30px 0;
  cursor: pointer;
}

#tik-tak-tabs .tik-tak-wrp .tik-tak-wrp-tab>i {
  display: block;
  margin-top: 2px;
}

#tik-tak-tabs .tik-tak-wrp .tik-tak-wrp-tab {
  display: none;
}

#tik-tak-tabs .tik-tak-wrp .tik-tak-wrp-tab.active {
  display: block;
}
</style>
<div id="tik-tak-tabs">
  <div class="tik-tak-select">
    <span class="tik-tak-tab tik-tak-moscow" data-timeZone="Europe/Moscow">Москва</span>
    <span class="tik-tak-tab tik-tak-london" data-timeZone="Europe/London">Лондон</span>
    <span class="tik-tak-tab tik-tak-new_york" data-timeZone="America/New_York">Нью Йорк</span>
    <span class="tik-tak-tab tik-tak-tokyo" data-timeZone="Asia/Tokyo">Токио</span>
  </div>
  <div class="tik-tak-wrp">
    <div class="tik-tak-wrp-tab active"><span id="tik-tak-moscow"></span><i>Москва</i></div>
    <div class="tik-tak-wrp-tab"><span id="tik-tak-london"></span><i>Лондон</i></div>
    <div class="tik-tak-wrp-tab"><span id="tik-tak-new_york"></span><i>Нью Йорк</i></div>
    <div class="tik-tak-wrp-tab"><span id="tik-tak-tokyo"></span><i>Токио</i></div>
  </div>
</div>

</body>
</html>
Ответить с цитированием
  #5 (permalink)  
Старый 16.01.2018, 14:43
Аватар для LADYX
Профессор
Отправить личное сообщение для LADYX Посмотреть профиль Найти все сообщения от LADYX
 
Регистрация: 19.02.2015
Сообщений: 219

рони,
да, супер! Огромное вам спасибо!!!
Ответить с цитированием
  #6 (permalink)  
Старый 16.01.2018, 16:55
Аватар для LADYX
Профессор
Отправить личное сообщение для LADYX Посмотреть профиль Найти все сообщения от LADYX
 
Регистрация: 19.02.2015
Сообщений: 219

рони,
ой, прошу прощения за глупый вопрос, конечно, скажите пожалуйста, а я смотрю, вы полностью изменили скрипт. И теперь он берет локальное время, а не серверное, или я что-то не понимаю?
Ответить с цитированием
  #7 (permalink)  
Старый 16.01.2018, 16:57
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

Сообщение от LADYX
берет локальное время, а не серверное
а где в вашем коде серверное?
Ответить с цитированием
  #8 (permalink)  
Старый 16.01.2018, 17:15
Аватар для LADYX
Профессор
Отправить личное сообщение для LADYX Посмотреть профиль Найти все сообщения от LADYX
 
Регистрация: 19.02.2015
Сообщений: 219

Сообщение от рони
а где в вашем коде серверное?
А разве нет? Тогда я нифига не понимаю, здесь я вам даже ответить ничего не могу. Помогите, пожалуйста, мне разобраться. Вот смотрите, мне нужно показывать моск.время. Не локальное, т.е. независимо от того, в каком часовом поясе находится пользователь, ему нужно показывать моск.время, ну и плюс с вкладками других городов, которые сделали.
Ответить с цитированием
  #9 (permalink)  
Старый 16.01.2018, 19:16
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,589

Вы путаете локальное время(время в определённой местности) и клиентское время(то что задано на компьютере пользователя). Javascript всегда берёт клиентское время, а уж какой часовой пояс выводить - уже дело параметров.
__________________
29375, 35
Ответить с цитированием
  #10 (permalink)  
Старый 16.01.2018, 20:24
Аватар для LADYX
Профессор
Отправить личное сообщение для LADYX Посмотреть профиль Найти все сообщения от LADYX
 
Регистрация: 19.02.2015
Сообщений: 219

Aetae,
Ах вон оно что, теперь понятно. И по скрипту: я правильно понимаю, что этот скрипт любому пользователю, независимо от того, в каком часовом поясе он находится, будет показывать по умолчанию именно моск.время?

А серверное время можно вывести только с помощью php, верно?
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Вывести HTML-код как текст Dion Элементы интерфейса 2 28.09.2015 22:45
как вывести значение из переменной nudist Общие вопросы Javascript 2 06.07.2015 14:22
как можно вывести рекламный код под заголовком в статье. kizerd jQuery 1 05.05.2015 09:00
как вывести сообщение только когда селект не выбран imediasun1 Элементы интерфейса 5 11.05.2013 17:40
Подскажите, пжлст, как вывести в тот же документ результат ф-ции? LexXxeL Элементы интерфейса 4 13.05.2009 13:26