http://127.0.0.1/readytoupload/time.php?time
{"hours":"06","minutes":"19","seconds":"22"}
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
var ser_hours, ser_minutes, ser_seconds;
Date Object
var ser_date = new Date();
Update Time Function
function updateClock ( )
{
//var currentTime = new Date ( );
var currentHours = ser_date.getHours ( );
var currentMinutes = ser_date.getMinutes ( );
var currentSeconds = ser_date.getSeconds ( );
// Pad the minutes and seconds with leading zeros, if required
currentMinutes = ( currentMinutes < 10 ? "0" : "" ) + currentMinutes;
currentSeconds = ( currentSeconds < 10 ? "0" : "" ) + currentSeconds;
// Choose either "AM" or "PM" as appropriate
var timeOfDay = ( currentHours < 12 ) ? "AM" : "PM";
// Convert the hours component to 12-hour format if needed
currentHours = ( currentHours > 12 ) ? currentHours - 12 : currentHours;
// Convert an hours component of "0" to "12"
currentHours = ( currentHours == 0 ) ? 12 : currentHours;
// Compose the string for display
var currentTimeString = currentHours + ":" + currentMinutes + ":" + currentSeconds + " " + timeOfDay;
$("#clock").html(currentTimeString);
}
Fetching Time From Server
function getClock_server ()
{
var ser_date = new Date();
//ser_hours = d.hours; ser_minutes = d.minutes, ser_seconds = d.seconds
$.get('http://127.0.0.1/readytoupload/time.php?time', function (d) { ser_date.setMinutes(d.minutes); ser_date.setSeconds(d.seconds); ser_date.setHours(d.hours);});
}
$(document).ready(function()
{
getClock_server();
setInterval('updateClock()', 1000);
});
</script>
<head>
<body>
Time Display section
<div id="clock"></div>
</body>
</html>
最佳答案
第一个问题是您将 ser_date 作为 getClock_server 中的局部变量，而您需要更新全局变量。
还要更新时间，我认为你需要获取当前时间和服务器请求发出时间之间的差异
var systime, ser_date;
function updateClock() {
var time = new Date(ser_date + new Date().getTime() - systime)
//var currentTime = new Date ( );
var currentHours = time.getHours();
var currentMinutes = time.getMinutes();
var currentSeconds = time.getSeconds();
// Pad the minutes and seconds with leading zeros, if required
currentMinutes = (currentMinutes < 10 ? "0" : "") + currentMinutes;
currentSeconds = (currentSeconds < 10 ? "0" : "") + currentSeconds;
// Choose either "AM" or "PM" as appropriate
var timeOfDay = (currentHours < 12) ? "AM" : "PM";
// Convert the hours component to 12-hour format if needed
currentHours = (currentHours > 12) ? currentHours - 12 : currentHours;
// Convert an hours component of "0" to "12"
currentHours = (currentHours == 0) ? 12 : currentHours;
// Compose the string for display
var currentTimeString = currentHours + ":" + currentMinutes + ":" + currentSeconds + " " + timeOfDay;
$("#clock").html(currentTimeString);
}
function getClock_server() {
// $.get('http://127.0.0.1/readytoupload/time.php?time', function(d) {
setTimeout(function() { //the timeout is used to simulate a ajax like async call
var d = {
hours: 10,
minutes: 0,
seconds: 25
}
var tmp = new Date();
tmp.setMinutes(d.minutes);
tmp.setSeconds(d.seconds);
tmp.setHours(d.hours);
ser_date = tmp.getTime();
systime = new Date().getTime();
updateClock();
setInterval(updateClock, 1000);
});
}
$(document).ready(function() {
getClock_server();
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<div id="clock"></div>关于javascript - 为什么 Jquery 在使用 set minutes 函数设置时间后显示当前系统时间？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32498120/