Javascript 使用AJAX请求显示jQuery时间

我正在构建一个使用AJAX从服务器检索数据的网页。我希望在div中显示时间（以小时/分/秒为单位，如10:45:30，带前导零）。我的一个AJAX调用很少运行；每次通话间隔约45分钟。该调用获取一个带有服务器当前时间的JSON字符串（通过PHP）。我可以把这个字符串和小时、分钟、秒分开，或者作为一个项目

我见过很多定时器函数，它们使用

setInterval

和JS函数来获取当前时间；它们在客户端/本地进行操作。我还看到过每分钟都需要服务器时间的函数（这似乎太频繁了）

我想做的是从AJAX调用中获取服务器的时间（我可以分配给变量；这部分我已经计算出来了），并让计时器函数使用该调用中的变量作为起点，以增加秒、分钟等

这里有一个关于这可能是什么样子的想法；首先，获取时间变量的AJAX调用

function askTime(){
        $.ajax({
                url: "servertime.php",
                dataType: "json",
                cache: false,
                success: function(data) {
                    timeHours = (data.timeHours);
                    timeMinutes = (data.timeMinutes);
                    timeSeconds = (data.timeSeconds);
                    timerFunction();

                },
            });
    }

然后在调用成功后，运行函数以特定id的div显示时间，如

$（'#timeDisplay）.html（timestring）

---

因此，简单地说：我如何使用jQuery来显示时间，使用不频繁的AJAX调用服务器时间？

如果您想要一个从返回的时间开始的时钟，我的建议是将时间值作为数字加载，并编写一个延迟的循环

jQuery

有一个以毫秒为单位的

.delay（）

方法。大概是

function myTimer(hours, minutes, seconds)
{
   while(true)
   {
     //add one to seconds, if equal to 60, set to 0 and add one to minutes,
     //same for hours
     delay(1000);
   }
}

---

getTime是我在服务器端设置的一个web方法，它返回JSON编码的日期时间（类似于/date（毫秒）/）

根据从web服务获取日期时间的方式，您可能希望更改javascript的这一部分（成功回调的第一行）

    var clientTimeUpdater = null;

    function askTime() {
        $.ajax({
            type: "POST",
            url: "WebForm1.aspx/getTime",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {
                var serverNowGetTime = msg.d.replace(/\/Date\(/, '').replace(/\)\//, '');
                var offset = (new Date()).getTime() - serverNowGetTime;
                clearInterval(clientTimeUpdater)

                // the client side updater
                clientTimeUpdater = setInterval(function () {
                    var serverNowGetTime = new Date((new Date()) - offset);
                    var hh = ('0' + serverNowGetTime.getHours()).slice(-2);
                    var mm = ('0' + serverNowGetTime.getMinutes()).slice(-2);
                    var ss = ('0' + serverNowGetTime.getSeconds()).slice(-2);
                    $("#myTime").text(hh + ':' + mm + ':' + ss);
                }, 1000);
            }
        });
    }

    $(document).ready(function () {
        // first call
        askTime();
        // call every 45 minutes
        setInterval(askTime, 2700000);
    })

---

我想我理解你希望实现的目标

您可以使用

setInterval（）

每秒（大约）更新一次时间。定期（比如每分钟）通过ajax调用与服务器同步时间。ajax

success

处理程序将使用

setTimeout

发出下一个ajax请求

var SYNC_INTERVAL = 60000;
var UPDATE_INTERVAL = 1000;

var $time = $('#time');

var serverOffset = 0;

function zeroPad(value) {
    return ('0' + value).slice(-2);
}

function updateTime() {
    var date = new Date(Date.now() + serverOffset);
    $time.text(zeroPad(date.getHours())
               + ':' + zeroPad(date.getMinutes())
               + ':' + zeroPad(date.getSeconds()));
}

function requestSyncWithServer() {
    $.ajax({
        type: 'get',
        url: 'servertime.php',
        dataType: 'json',
        success: function(date) {
            serverOffset = date - Date.now();
            updateTime();
            setTimeout(function() {
                requestSyncWithServer();
            }, SYNC_INTERVAL);
        }
    });
}

updateTime();
setInterval(function() { updateTime(); }, UPDATE_INTERVAL);
requestSyncWithServer();

---

在这里尝试一个示例代码可能会对您有所帮助，但您不确定自己到底在问什么……您可以使用AJAX调用获取服务器时间，计算结果与客户端时间之间的偏移量，然后使用该偏移量和客户端时间来显示您的时间。除非客户端出现任何问题和夏令时调整，否则您应该很好。@avghhighschoolstudent-您是否在询问ajax调用返回的

日期

值的格式？我的答案中的代码假设它是一个表示自纪元（即1970年1月1日）以来毫秒数的单个数字。这是表示日期时间值的标准方法。但是，如果您的服务器返回其他内容，则可以很容易地容纳它。请告诉我您的服务器返回了什么，我可以帮您。@avghhighschoolstudent-BTW，我发现我忘了包含

数据类型：“json”

。我现在已经添加了它。我使用PHP，所以我可以用多种方式轻松格式化它。只需要知道假设的格式，尽管时间将是更大JSON集的一部分（例如，它将是data.TimeStamp）