Что делает ваш скрипт, так это опрашивает скрипт на вашем сервере по адресу inc / clock.php и заменяет содержимое вашего элемента #clock_time выводом из скрипта (примерно) каждую секунду.Это должно работать, если у вас есть элемент с идентификатором clock_element и скриптом по адресу yoursite.tld / inc / clock.php
Однако я не согласен постоянно опрашивать сервер на предмет его текущего времени.Достаточно синхронизировать время только один раз с вашим веб-сервером.Помимо некоторых незначительных различий, это должно синхронизировать ваши часы достаточно долго.Если ваше веб-приложение будет работать более пары часов или дней, вам следует периодически повторно синхронизировать ваши часы (один раз в день или неделю).
Используйте объект Date, чтобы отслеживать время сервера на вашем клиенте.Просто создайте объект Date из выходных данных clock.php (допустимый вывод даты в качестве предварительного условия) и периодически обновляйте ваш clock_element (как каждую секунду) в соответствии с дельтой времени, когда вы синхронизировали свои часы с удаленным сервером.
Вот грубый код, не проверенный, возможно, некоторые синтаксические ошибки, но вкратце показывает, что вы должны сделать:
function setupServerClock( clock_element, remote_time_url, remote_update_interval, local_update_interval ) {
var w = window;
// client time on resync
var ct = new Date();
// server time on resync
var st = new Date();
// setup resync
w.setInterval( function() {
jQuery.ajax( {
url: remote_time_url,
success: function (data) {
ct = new Date();
st = new Date(data);
}
});
}, remote_update_interval);
// setup local clock display
w.setInterval( function() {
// the time passed on our local machine since the last resync
var delta = new Date() - ct;
// we assume the same time passed at the server
// (yeah, I know, spacetime might not be the same at the servers
// place and off the shelve clocks are pretty inaccurate)
var clock = st - 0 + delta; // - 0 to convert to microsecond timestamp
jQuery(clock_element).html(new Date(clock));
}, local_update_interval);
}
Назовите его примерно так:
setupServerClock( jQuery('#clock_element'), 'inc/clock.php', 1000 * 60 * 60, 1000 );
Это настроитчасы, которые нужно записать в #clock_element, используя значение, возвращаемое из yourdomain.tld / inc / clock.php, повторно синхронизировать часы каждый час и обновлять локальное представление часов каждую секунду.
Да, и если этопериодическая повторная синхронизация действительно вызывает «скачки» в часах, о которых вы могли бы подумать, просто сообщив пользователю о том, что его часы были обновлены, например, вот так
w.setInterval( function() {
jQuery(clock_element).html('resyncing clock...');
jQuery.ajax( {
url: remote_time_url,
success: function (data) {
ct = new Date();
st = new Date(data);
}
});
}, remote_update_interval);