我敢打赌必须有一些插件可以将这个问题变成更容易解决的问题，比如MomentJs，但实际情况是这样;我不知道如何使用它:)所以我想尽可能地做它。
我已经在这里构建了一个ALMOST-WORKING示例：
进行了界面和控制，但我仍然缺少以下功能：1。自动检测用户的时区（如'-1'，'0'，'+ 2'）并计算给定时间（参见输入） #time）匹配法国时区（UTC / GMT +2）。
以某种顺序：
到目前为止，这是我的脚本，这些是控件，我不知道如何构建所需的函数，以便像上面描述的那样工作：）
$(document).ready(function () {
//Automatically detect user's timezone and store it inside this variable
//Let's use a temporal example just to see how the whole script works
var userTimeZone = "-3"; //here goes a function, its just an example of the variable userTimeZone already resolved for some function I don't know how to code hehe
$("#detected").hide().fadeIn(2000); //just4fancy
$("#uTZ").text(userTimeZone); //print the detected timezone
var timeInput = $('#time');
timeInput.focus();
timeInput.on('change keyup mouseup', function () {
var userTZ = $("#uTZ").text();
var franceTZ = "2"; //predefined timezone of France +2
//Now I try to set the differnce of timezones in order to see how to calculate the final time
var calculation = userTZ-franceTZ; //here is where the calculation happens. Actually, It is (of course) wrong :)
var actualValue = $(this).val();
//print the results
if (timeInput.val() !== '00') {
$('#actual').text(actualValue + ':00 hours');
$('#result').text(actualValue - calculation + ':00 hours'); //this calculates
the given time with the difference of timezones to show a converted time
$('.panel-footer').removeClass('hidden').hide().slideDown();
}
}).bind('mousewheel', function (e) {
return false;
});
});
如果它对某人有用，我发现了这个Convert timezone offset number of hours to timezone offset in (military?) hours，但我不知道如何在我的脚本上实现相同的内容：（
提前致谢！
答案 0 :(得分：3)
一些事情：
时区与偏移量不同，不能这样对待。抵消也不能限制在整个小时。请在the timezone tag wiki中阅读“时区！=偏移”。
法国的时区为"Europe/Paris"。它仅在daylight saving time生效的夏季使用+2偏移量。在今年剩下的时间里，它使用+1抵消。
您实际上并不需要检测用户的时区才能使其正常工作。浏览器已在用户的时区内工作。无论浏览器设置如何，您都需要能够使用法语时间。您可以使用库。
你说你用过了moment.js。您只需使用moment-timezone扩展名。
// current time in France
moment().tz('Europe/Paris').format('H:mm')
// When it's 3:00 local time today, what time is it in France?
moment('3:00','H:mm').tz('Europe/Paris').format('H:mm')
您应该注意如何呈现信息。简单地说“当它在A中的X时间，它在B中的Y时间”是无效的。还必须涉及日期，因为答案可能会根据DST当前是在A还是在B中生效而更改。您可以参考“今天”，但请确保您知道今天是A还是今天B。不一样。
您可能还会发现某些输入值不明确。例如，如果我说它是2014年11月2日纽约凌晨1点，那么可能是美国东部标准时间1点（UTC-4），也可能是1小时后美国东部标准时间1点（UTC-5） 。你会发现，如果输入含糊不清，有些浏览器会选择白天时间（IE，Safari），有些会选择标准时间（Chrome，Firefox，Opera，NodeJS）。
答案 1 :(得分：0)
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript" >
/*finding time for india and usa in both 12hr and 24 hr format*/
function indUsaTime(){
msg1=document.getElementById("msg1");
msg2=document.getElementById("msg2");
msg3=document.getElementById("msg3");
msg4=document.getElementById("msg4");
dayFormatIndia=document.getElementById("dayFormatIndia");
dayFormatUs=document.getElementById("dayFormatUs");
/*creating date object to collect hours/minutes/seconds*/
var date=new Date();
var hrs=date.getHours();
/*converting into 12hr format*/
if(hrs>12){
hrs1=hrs%12;
dayFormatIndia.innerHTML="PM";
}
else if(hrs==12){
hrs1=hrs;
dayFormatIndia.innerHTML="PM";
}else{
hrs1=hrs;
dayFormatIndia.innerHTML="AM";
}
/*printing both 12hr and 24hr format for India*/
msg1.innerHTML=hrs1+":"+date.getMinutes()+":"+date.getSeconds();
msg2.innerHTML=hrs+":"+date.getMinutes()+":"+date.getSeconds();
var hrsUS=hrs-10;
var mnsUS=date.getMinutes()+30;
mnsUS=mnsUS%60;
/*converting hours of usa east cost using its minutes*/
if(mnsUS>=0&&mnsUS<30){
hrsUS=date.getHours()-9;
}else{
hrsUS=date.getHours()-10;
}
/*converting into proper 24 hr format based upon cases*/
if(hrsUS<0){
hrsUS=hrsUS+24;
}
if(hrsUS>24){
hrsUS=hrsUS%24;
}
/*converting into proper 12 hr format based upon cases*/
if(hrsUS<0){
hrsUS=hrsUS+12;
}else{
hrsUS=hrsUS;
}
if(hrsUS>=12){
hrsUS1=hrsUS%12;
dayFormatUs.innerHTML="PM";
}if(hrsUS==0){
hrsUS1=hrsUS+12;
dayFormatUs.innerHTML="AM";
}else{
hrsUS1=hrsUS;
dayFormatUs.innerHTML="AM";
}
/*printing both 12hr format and 24hr format*/
msg3.innerHTML=hrsUS1+":"+mnsUS+":"+date.getSeconds();
msg4.innerHTML=hrsUS+":"+mnsUS+":"+date.getSeconds()
}
/*calling indUsaTime() in each second sothat it will look dynamic*/
setInterval(indUsaTime,1000);
function bodyload(){
indUsaTime();
/*input countries as an array and appending on bodyload*/
countries=["select","UK(+1 GMT)","Germany(+2 GMT)","Spain(+2 GMT)","Brazil(-3 GMT)","Mexico(-5 GMT)","Japan(+9 GMT)","Canada(-4 GMT)","Aus(+10 GMT)","Qatar(+3 GMT)"];
country=document.getElementById("country");
for(i=0;i<countries.length;i++){
var opt=document.createElement("option");
opt.text=countries[i];
opt.values=countries[i];
country.appendChild(opt);
}
}
/*finding time for all the countries in our list*/
function findTime(){
country=document.getElementById("country");
showTime=document.getElementById("showTime");
var date=new Date();
switch(country.value)
{
case "UK(+1 GMT)":
/*converting minute of UK*/
ukMns=date.getMinutes()+30;
ukMns=ukMns%60;
/*converting hours of UK*/
if(ukMns>=0&&ukMns<30){
ukHrs=date.getHours()-4;
}else{
ukHrs=date.getHours()-5;
}
if(ukHrs<0){
ukHrs=ukHrs+24;
}else{
ukHrs=ukHrs;
}
/*printing 24hr format*/
showTime.innerHTML=ukHrs+":"+ukMns+":"+date.getSeconds();
break;
case "Germany(+2 GMT)":
/*converting minute of Germany*/
germanyMns=date.getMinutes()+30;
germanyMns=germanyMns%60;
/*converting hours of Germany*/
if(germanyMns>=0&&germanyMns<30){
germanyHrs=date.getHours()-3;
}else{
germanyHrs=date.getHours()-4;
}
if(germanyHrs<0){
germanyHrs=germanyHrs+24;
}else{
germanyHrs=germanyHrs;
}
/*printing 24hr format*/
showTime.innerHTML=germanyHrs+":"+germanyMns+":"+date.getSeconds();
break;
case "Spain(+2 GMT)":
/*converting minutes of Spain*/
spainMns=date.getMinutes()+30;
spainMns=spainMns%60;
/*converting hours of Spain*/
if(spainMns>=0 && spainMns<30){
spainHrs=date.getHours()-3;
}else{
spainHrs=date.getHours()-4;
}
if(spainHrs<0){
spainHrs=spainHrs+24;
}else{
spainHrs=spainHrs;
}
/*printing 24hr format*/
showTime.innerHTML=spainHrs+":"+spainMns+":"+date.getSeconds();
break;
case "Mexico(-5 GMT)":
/*converting minutes of Mexico*/
mexicoMns=date.getMinutes()+30;
mexicoMns=mexicoMns%60;
/*converting hours of Spain*/
if(mexicoMns>=0 && mexicoMns<30){
mexicohrs=date.getHours()-10;
}
else{
mexicohrs=date.getHours()-11;
}
if(mexicohrs<0){
mexicohrs=mexicohrs+24;
}
else{
mexicohrs=mexicohrs;
}
/*printing 24hr format*/
showTime.innerHTML=mexicohrs+":"+mexicoMns+":"+date.getSeconds();
break;
case "Brazil(-3 GMT)":
/*converting minutes Brazil*/
brazilMns=date.getMinutes()+30;
brazilMns=brazilMns%60;
/*converting hours of Mexico*/
if(brazilMns>=0 && brazilMns<30){
brazilHrs=date.getHours()-8;
}else{
brazilHrs=date.getHours()-9;
}
if(brazilHrs<0){
brazilHrs=brazilHrs+24;
}else{
brazilHrs=brazilHrs;
}
/*printing 24hr format*/
showTime.innerHTML=brazilHrs+":"+brazilMns+":"+date.getSeconds();
break;
case "Japan(+9 GMT)":
/*converting minutes of Japan*/
japanMns=date.getMinutes()+30;
japanMns=japanMns%60;
/*converting hours of Japan*/
if(japanMns>=0 && japanMns<30){
japanHrs=date.getHours()+4;
}else{
japanHrs=date.getHours()+3;
}
if(japanHrs<0){
japanHrs=japanHrs+24;
}
else{
japanHrs=japanHrs;
}
/*printing 24hr format*/
showTime.innerHTML=japanHrs+":"+japanMns+":"+date.getSeconds();
break;
case "Canada(-4 GMT)":
/*converting minutes of Canada*/
canadaMns=date.getMinutes()+30;
canadaMns=canadaMns%60;
/*converting hours of Canada*/
if(canadaMns>=0 && canadaMns<30){
canadaHrs=date.getHours()-9;
}else{
canadaHrs=date.getHours()-10;
}
if(canadaHrs<0){
canadaHrs=canadaHrs+24;
}else{
canadaHrs=canadaHrs;
}
/*printing 24hr format*/
showTime.innerHTML=canadaHrs+":"+canadaMns+":"+date.getSeconds();
break;
case "Aus(+10 GMT)":
/*converting minutes of Aus*/
ausMns=date.getMinutes()+30;
ausMns=ausMns%60;
/*converting hours of Canada*/
if(ausMns>=0 && ausMns<30){
ausHrs=date.getHours()+5;
}else{
ausHrs=date.getHours()+4;
}
if(ausHrs<0){
ausHrs=ausHrs+24;
}else{
ausHrs=ausHrs;
}
/*printing 24hr format*/
showTime.innerHTML=ausHrs+":"+ausMns+":"+date.getSeconds();
break;
case "Qatar(+3 GMT)":
/*converting minutes of Qatar*/
qatarMns=date.getMinutes()+30;
qatarMns=qatarMns%60;
/*converting hours of Qatar*/
if(qatarMns>=0 && qatarMns<30){
qatarHrs=date.getHours()-2;
}else{
qatarHrs=date.getHours()-3;
}
if(qatarHrs<0){
qatarHrs=qatarHrs+24;
}else{
qatarHrs=qatarHrs;
}
/*printing 24hr format*/
showTime.innerHTML=qatarHrs+":"+qatarMns+":"+date.getSeconds();
break;
default:
/*clearing div*/
showTime.innerHTML="";
break;
}
}
/*dropdownlist countries time dynamic*/
setInterval(findTime,1000);
</script>
</head>
<body onload="bodyload()">
<fieldset>
<legend style="margin:auto">
<b>India(+5:30 GMT)</b>
</legend>
<table width="300px" cellspacing="2px" cellpadding="2px">
<tr>
<td align="center">
<i>12 hr format</i>
</td>
<td align="center" style="width:180px">
<span align="center" id="msg1" class="digiClock">
</span>
<span id="dayFormatIndia" class="digiClock">
</span>
</td>
</tr>
<tr>
<td align="center">
<i>24 hr format</i>
</td>
<td align="center" style="width:180px">
<span id="msg2" class="digiClock">
</span>
</td>
</tr>
</table>
</fieldset>
<fieldset>
<legend style="margin:auto">
<b>USA-EastCost(-4:00 GMT)</b>
</legend>
<table width="300px">
<tr>
<td align="center">
<i>12 hr format</i>
</td>
<td align="center" style="width:180px">
<span align="center" id="msg3" class="digiClock" >
</span> 
<span id="dayFormatUs" class="digiClock">
</span>
</td>
</tr>
<tr>
<td align="center">
<i>24 hr format</i>
</td>
<td align="center">
<span id="msg4" class="digiClock">
</span>
</td>
</tr>
</table>
</fieldset>
<fieldset>
<legend style="margin:auto">
<b>other countries(24 hr format)</b>
</legend>
<table width="300px">
<tr>
<td >
<select id="country" onclick="findTime()">
</select>
</td>
<td align="left">
<span id="showTime" class="digiClock"></span>
<span id="formatTime">
</span>
</td>
</tr>
</table>
</fieldset>
</body>
</html>