Affichage de la date/heure dans le fuseau horaire de l'utilisateur - le côté client

Question

J'ai une application web qui affiche des timbres datetime sur chaque page, par exemple:

12 Décembre, 2009 18:00

Je voudrais détecter dynamiquement le fuseau horaire de l'utilisateur et modifier l'affichage en utilisant JavaScript.

Ainsi, l'utilisateur de New York verrait:

12 Décembre, 2009 18:00

Alors que l'utilisateur Californie verrait:

12 Décembre 2009 3 : 00 pm

Des suggestions?

Answer 1

Voici comment vous pouvez le faire avec le merveilleux « amélioration progressive »:

sortie la date à laquelle vous souhaitez qu'il apparaisse, mais assurez-vous de préciser son fuseau horaire (je l'utilise GMT, mais vous pouvez utiliser UTC, etc.). Puis échangez-le avec l'heure locale en charge (géré automatiquement par JavaScript si le fuseau horaire d'origine est fourni).

<div id="timestamp">December 12, 2009 6:00 pm GMT</div> 
<script type="text/javascript"> 
    var timestamp = document.getElementById('timestamp'), 
     t   = new Date(timestamp.innerHTML), 
     hours  = t.getHours(), 
     min  = t.getMinutes() + '', 
     pm  = false, 
     months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']; 

    if(hours > 11){ 
     hours = hours - 12; 
     pm = true; 
    } 

    if(hours == 0) hours = 12; 
    if(min.length == 1) min = '0' + min; 

    timestamp.innerHTML = months[t.getMonth()] + ' ' + t.getDate() + ', ' + t.getFullYear() + ' ' + hours + ':' + min + ' ' + (pm ? 'pm' : 'am'); 
</script> 

Answer 2

Vous pouvez utiliser Date.getTimeZoneOffset() pour obtenir le décalage local de GMT.

var date = new Date(); 
var offset = date.getTimezoneOffset(); 

De là, c'est un SMOP. En utilisant l'objet Javascript Date, vous pouvez appeler date.toDateString pour obtenir une date lisible par l'homme. Si vous en avez besoin côté serveur, demandez au Javascript d'envoyer le décalage à votre serveur avec un GET ou un POST.

Le formatage de la date est une autre histoire. Javascript ne fournit pas beaucoup intégré. Vous pouvez le pirater vous-même, mais de cette façon, les bugs et la folie se trouvent. Le formatage de date est quelque chose que toute bonne bibliothèque Javascript devrait fournir. Par exemple, JQuery a Datepicker.formatDate.

Answer 3

Nous utilisons la bibliothèque ExtJS, qui possède des fonctionnalités relatives à la date et l'heure qui peut vous aider beaucoup. En fait, sur Mozilla Firefox, il affiche toutes les dates et heures en fonction du fuseau horaire des navigateurs.