Detect timezone abbreviation using JavaScript

Question

I need a way to detect the timezone of a given date object. I do NOT want the offset, nor do I want the full timezone name. I need to get the timezone abbreviation. For example, GMT, UTC, PST, MST, CST, EST, etc...

Is this possible? The closest I've gotten is parsing the result of date.toString(), but even that won't give me an abbreviation. It gives me the timezone's long name.

Answer 1

try {
    result = /.*\s(.+)/.exec(date.toLocaleDateString(navigator.language, {timeZoneName:'short' }))[1];
} catch(e) {
    result = (new Date()).toTimeString().match(new RegExp("[A-Z](?!.*[\(])","g")).join('');
}

console.log(result);

Answer 2

Updated for 2015:

jsTimezoneDetect can be used together with moment-timezone to get the timezone abbreviation client side:

moment.tz(new Date(), jstz.determine().name()).format('z');  //"UTC"

Moment-timezone cannot do this on it's own as its function which used to handle this was depreciated because it did not work under all circumstances: https://github.com/moment/moment/issues/162 to get the timezone abbreviation client side.

Answer 3

I was able to achieve this with only moment.

moment.tz(moment.tz.guess()).zoneAbbr() //IST

Answer 4

Here is a JavaScript self-updating, 12-hour format date/time display that doesn't quite answer the question, however it may help others as it is related and builds on Stephen DuMont's solution and MDN link. W3 Schools had a very helpful tutorial, and real-time updates do not require page refresh.

Tests with the latest versions of desktop FireFox, Chrome, Opera, and Internet Explorer 11 all work. The "2-digits" hour only appears to prefix a zero for single values in IE, however the minutes return a 2-digit value reliably for all browsers. Tests with discontinued Windows Safari work although 12-hour format is ignored and seconds are not hidden.

The function includes the local timezone, as well adjustable options for fall-back languages, day and date display, and 12/24 hour format. Date and time were split to add the separating 'at' string. Setting only 'toLocaleTimeString' with select options will also return both date and time. The MDN pages can be referenced for options and values.

<!--
function dateTimeClock() {
  var date = new Date();
  document.getElementById('timedate').innerHTML = date.toLocaleDateString(['en-us', 'en-GB'], {
      weekday: 'long',
      month: 'long',
      day: '2-digit',
      year: 'numeric'
    }) + ' at ' +
    date.toLocaleTimeString(['en-us', 'en-GB'], {
      hour12: 'true',
      hour: '2-digit',
      minute: '2-digit',
      timeZoneName: 'short'
    });
  var t = setTimeout(dateTimeClock, 500);
}

function start() {
  dateTimeClock();
}
window.onload = start;
//-->

<div id="timedate"></div>

Answer 5

If all else fails, you can simply create your own hashtable with the long names and abbreviations.

Answer 6

This works perfectly in Chrome, Firefox but only mostly in IE11. In IE11, timezones without straight forward abbreviations like "Indian Chagos Time" will return "ICT" instead of the proper "IOT"

var result = "unknown";
try{
    // Chrome, Firefox
    result = /.*\s(.+)/.exec((new Date()).toLocaleDateString(navigator.language, { timeZoneName:'short' }))[1];
}catch(e){
    // IE, some loss in accuracy due to guessing at the abbreviation
    // Note: This regex adds a grouping around the open paren as a
    //       workaround for an IE regex parser bug
    result = (new Date()).toTimeString().match(new RegExp("[A-Z](?!.*[\(])","g")).join('');
}
console.log(result);

Result:

"CDT"