动态服务器时间

发布于 2024-09-28 16:07:35 字数 628 浏览 3 评论 0原文

据我了解，我无法使用脚本中的 settimeout() 获取 IE 中的动态服务器时间。我发现了这个示例：

function  timeExam(){

    $.ajax({
    url : "inc/clock.php",
    success : function (data) {
    $("#clock_time").html(data);
    }
    });

           var func = function()
            {
                timeExam();
            }

            setTimeout(func, 1000);
    }


            <body onload="timeExam();">
                bla bla bla
            </body>

也许可以使其工作？

如果没有，您能否建议我一个可在所有浏览器中使用的具有服务器时间的动态时钟？我尝试使用prototype.js制作时钟，但它与IE8中的jquery UI冲突（错误地显示了selectmenu）。我添加了脚本中没有冲突代码，但它没有用......必须删除prototype.js

原文

As I understand there is no way I can get dynamic server time in IE with settimeout() in script.. I found this example:

function  timeExam(){

    $.ajax({
    url : "inc/clock.php",
    success : function (data) {
    $("#clock_time").html(data);
    }
    });

           var func = function()
            {
                timeExam();
            }

            setTimeout(func, 1000);
    }


            <body onload="timeExam();">
                bla bla bla
            </body>

Maybe it is possible to make it work?

If not, could you please suggest me a dynamic clock with server time that works in all browsers?! I tried a clock with prototype.js but it conflicted with jquery UI in IE8(showed selectmenu incorrectly). I added that no conflict code to script but it was useless.. had to remove prototype.js

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

复古式 2024-10-05 16:07:35

您的脚本的作用是轮询服务器上 inc/clock.php 上的脚本，并（大约）每秒用脚本的输出替换 #clock_time 元素的内容。
这应该可以工作，前提是您有一个 id 是clock_element 的元素，并且在 yoursite.tld/inc/clock.php 有一个脚本。

但是，我不同意不断轮询服务器的当前时间。只需将时间同步到您的网络服务器一次就足够了。除了一些细微的差异之外，这应该可以让您的时钟在一段时间内保持良好的同步。如果您的网络应用程序运行时间超过几个小时或几天，您应该定期重新同步时钟（每天或每周一次即可）。

使用 Date 对象来跟踪客户端上的服务器时间。只需从clock.php的输出创建一个Date对象（作为先决条件的有效日期输出），并根据您将时钟与远程服务器同步的时间增量定期（例如每秒）更新您的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 );

这将使用从 yourdomain.tld/inc/ 返回的值将时钟设置为写入#clock_element 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);

What your script does is poll a script on your server at inc/clock.php and replace your #clock_time element's contents with the output from the script (roughly) every second.
This should work, provided you have a element with id clock_element and a script at yoursite.tld/inc/clock.php

However, I disagree to constantly poll the server for it's current time. It should suffice to sync time only once to your webserver. Beside some minor differences this should keep your clocks synced well enough for a good while. If your webapp will run more than a couple of hours or days you should periodicly resync your clock (once a day or a week should do).

Use a Date object to keep track of the servertime on your client. Simply create a Date object from the output of clock.php (a valid date output as prerequisite) and update your clock_element periodicly (like every second) according to the time delta from when you synced your clock with the remote server.

Here some rough code, not tested, propably some syntax errors, but briefly shows what you should do:

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);
}

Call it with something like:

setupServerClock( jQuery('#clock_element'), 'inc/clock.php', 1000 * 60 * 60, 1000 );

This will setup the clock to be written to #clock_element, using the value returned from yourdomain.tld/inc/clock.php, resync the clock every hour and update the local representation of the clock every second.

Oh and if that periodical resync indeed brings up "jumps" in the clock you could think about simply giving the user feedback, that his clock was updated, eg like this

    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);

回复收藏 0 原文

旧时模样 2024-10-05 16:07:35

由于您使用的是 jQuery：

$(function() {
  var updateSeconds = 60;
  function updateClock() {
    $.ajax({
      url : "inc/clock.php",
      success : function (data) {
        $("#clock_time").html(data);
        setTimeout(updateClock, updateSeconds * 1000);
      }
    });
  }
  setTimeout(updateClock, updateSeconds * 1000);
});

根据需要更改“updateSeconds”。

我使用 setTimeout 而不是 setInterval 来完成此操作，因为它更安全一些。如果服务器出现问题，这个请求不会一遍又一遍地堆积注定失败的 HTTP 请求，因为在当前请求成功之前它不会设置新的更新。

Since you're using jQuery:

$(function() {
  var updateSeconds = 60;
  function updateClock() {
    $.ajax({
      url : "inc/clock.php",
      success : function (data) {
        $("#clock_time").html(data);
        setTimeout(updateClock, updateSeconds * 1000);
      }
    });
  }
  setTimeout(updateClock, updateSeconds * 1000);
});

Change "updateSeconds" however you want.

I did this with setTimeout instead of setInterval because it's a little safer. If there's a server problem, this one won't pile up doomed HTTP requests over and over again, because it doesn't set up a new update until the current one succeeds.

回复收藏 0 原文

~没有更多了~