彩色时钟与CSS&；用jQuery实时的服务器，而不是cliets时间，怎么办？

我使用jQuery教程制作了一个时钟：

但是这个手表需要客户端的时间，我会使用这个jQuery来获取服务器时间，我如何才能获取服务器时间呢

---

编辑：

script.js

$(document).ready(function(){
/* This code is executed after the DOM has been completely loaded */

$('#fancyClock').tzineClock();

});

jquery.tzineClock.js

(function($){

// A global array used by the functions of the plug-in:
var gVars = {};

// Extending the jQuery core:
$.fn.tzineClock = function(opts){

    // "this" contains the elements that were selected when calling the plugin: $('elements').tzineClock();
    // If the selector returned more than one element, use the first one:

    var container = this.eq(0);

    if(!container)
    {
        try{
            console.log("Invalid selector!");
        } catch(e){}

        return false;
    }

    if(!opts) opts = {}; 

    var defaults = {
        /* Additional options will be added in future versions of the plugin. */
    };

    /* Merging the provided options with the default ones (will be used in future versions of the plugin): */
    $.each(defaults,function(k,v){
        opts[k] = opts[k] || defaults[k];
    })

    // Calling the setUp function and passing the container,
    // will be available to the setUp function as "this":
    setUp.call(container);

    return this;
}

function setUp()
{
    // The colors of the dials:
    var colors = ['orange','blue','green'];

    var tmp;

    for(var i=0;i<3;i++)
    {
        // Creating a new element and setting the color as a class name:

        tmp = $('<div>').attr('class',colors[i]+' clock').html(
            '<div class="display"></div>'+

            '<div class="front left"></div>'+

            '<div class="rotate left">'+
                '<div class="bg left"></div>'+
            '</div>'+

            '<div class="rotate right">'+
                '<div class="bg right"></div>'+
            '</div>'
        );

        // Appending to the container:
        $(this).append(tmp);

        // Assigning some of the elements as variables for speed:
        tmp.rotateLeft = tmp.find('.rotate.left');
        tmp.rotateRight = tmp.find('.rotate.right');
        tmp.display = tmp.find('.display');

        // Adding the dial as a global variable. Will be available as gVars.colorName
        gVars[colors[i]] = tmp;
    }

    // Setting up a interval, executed every 1000 milliseconds:
    setInterval(function(){

        var currentTime = new Date();
        var h = currentTime.getHours();
        var m = currentTime.getMinutes();
        var s = currentTime.getSeconds();

        animation(gVars.green, s, 60);
        animation(gVars.blue, m, 60);
        animation(gVars.orange, h, 24);

    },1000);
}

function animation(clock, current, total)
{
    // Calculating the current angle:
    var angle = (360/total)*(current+1);

    var element;

    if(current==0)
    {
        // Hiding the right half of the background:
        clock.rotateRight.hide();

        // Resetting the rotation of the left part:
        rotateElement(clock.rotateLeft,0);
    }

    if(angle<=180)
    {
        // The left part is rotated, and the right is currently hidden:
        element = clock.rotateLeft;
    }
    else
    {
        // The first part of the rotation has completed, so we start rotating the right part:
        clock.rotateRight.show();
        clock.rotateLeft.show();

        rotateElement(clock.rotateLeft,180);

        element = clock.rotateRight;
        angle = angle-180;
    }

    rotateElement(element,angle);

    // Setting the text inside of the display element, inserting a leading zero if needed:
    clock.display.html(current<10?'0'+current:current);
}

function rotateElement(element,angle)
{
    // Rotating the element, depending on the browser:
    var rotate = 'rotate('+angle+'deg)';

    if(element.css('MozTransform')!=undefined)
        element.css('MozTransform',rotate);

    else if(element.css('WebkitTransform')!=undefined)
        element.css('WebkitTransform',rotate);

    // A version for internet explorer using filters, works but is a bit buggy (no surprise here):
    else if(element.css("filter")!=undefined)
    {
        var cos = Math.cos(Math.PI * 2 / 360 * angle);
        var sin = Math.sin(Math.PI * 2 / 360 * angle);

        element.css("filter","progid:DXImageTransform.Microsoft.Matrix(M11="+cos+",M12=-"+sin+",M21="+sin+",M22="+cos+",SizingMethod='auto expand',FilterType='nearest neighbor')");

        element.css("left",-Math.floor((element.width()-50)/2));
        element.css("top",-Math.floor((element.height()-50)/2));
    }

}

})(jQuery)

所以我试着把

            var clienttime = new Date();
            var servertime = 1368597301000; // *mili*seconds

在函数内部，但即使这样也不起作用

---

我需要做什么？

您可以通过php/asp等来打发时间。由于传输/渲染延迟，时间不会完全同步，但大多数时间都可以正常工作

然后使用变量并将其与本地时间进行比较

var clienttime = new Date();
var servertime = 1368597301000; // *mili*seconds
// snip
setInterval(function(){
    var currentTime = new Date();
    currentTime.setTime(currentTime.getTime()+servertime.time-clienttime.time);

$（文档）.ready（函数（）{ setInterval（函数（） { var seconds=新日期（）.getSeconds（）； var sdegree=秒*6； var srotate=“旋转（“+sdegree+”deg）”； $（“#秒”）.css（{“-moz-transform”：srotate，“-webkit-transform”：srotate}）； }, 1000); setInterval（函数（） { var hours=新日期（）.getHours（）； var mins=新日期（）.getMinutes（）； var hdegree=小时*30+（分钟/2）； var hrotate=“旋转（“+hdegree+”deg）”； $（“#小时”）.css（{“-moz-transform”：hrotate，“-webkit-transform”：hrotate}）

}，1000）；
setInterval（函数（）
{
var mins=新日期（）.getMinutes（）；
var mdegree=分钟*6；
var mrotate=“旋转（“+mdegree+”deg）”；
$（“#min”）.css（{“-moz-transform”：mrotate，“-webkit-transform”：mrotate}）；
}, 1000);
});    

---

查看完整描述检查

亲爱的MarZab谢谢！但我不知道该怎么做。请帮助，我有这个档案：在我的aspx页面中，我有脚本arqchives链接到.js。我使用.js，我需要在我的.js中做什么更改？在每个页面中都有servertime吗？考虑到您需要如上所述更改setinterval的代码，然后在需要此时钟的每一页上，您需要如上所述打印servertime。亲爱的玛扎布，我会照你说的做，但不要工作，时间以小时表示，以分秒表示，而不是以小时表示。

var clienttime = new Date();
var servertime = 1368597301000; // *mili*seconds
// snip
setInterval(function(){
    var currentTime = new Date();
    currentTime.setTime(currentTime.getTime()+servertime.time-clienttime.time);

        }, 1000);
        setInterval(function ()
         {
            var mins = new Date().getMinutes();
            var mdegree = mins * 6;
            var mrotate = "rotate(" + mdegree + "deg)";
            $("#min").css({ "-moz-transform": mrotate, "-webkit-transform": mrotate });
        }, 1000);
    });    
</script>