¿Hay un complemento JQuery para convertir las fechas UTC en la zona horaria del usuario local?

Question

Si tengo una etiqueta:

<span class="utctime">2010-01-01 11:30 PM</span> 

Me gustaría tener un script de jQuery o el enchufe en convertir cada clase utctime al navegador hora local del usuario actual. Preferiría encontrar esto antes de escribir uno.

Answer 1

Ok, así que creé una que lo hace:

/* 
    Note: this requires that the JQuery-DateFormat plugin (available here) be loaded first 
    http://plugins.jquery.com/project/jquery-dateFormat 
*/ 

(function ($) { 
    $.fn.localTimeFromUTC = function (format) { 

     return this.each(function() { 

      // get time offset from browser 
      var currentDate = new Date(); 
      var offset = -(currentDate.getTimezoneOffset()/60); 

      // get provided date 
      var tagText = $(this).html(); 
      var givenDate = new Date(tagText); 

      // apply offset 
      var hours = givenDate.getHours(); 
      hours += offset; 
      givenDate.setHours(hours); 

      // format the date 
      var localDateString = $.format.date(givenDate, format); 
      $(this).html(localDateString); 
     }); 
    }; 
})(jQuery); 

Uso:

<span class="utcdate">2/5/2010 10:30 PM</span> 

    $('.utcdate').localTimeFromUTC('MM/dd/yyyy hh:mm a'); 

Answer 2

CodeGrue gracias por compartir esto con la comunidad.

Para aquellos que se ven obligados a trabajar con otras zonas horarias que UTC .. Usted puede alterar la función mediante la adición de la diferencia de tiempo de la siguiente manera:

fragmento original:

var offset = -(currentDate.getTimezoneOffset()/60); 

de fragmentos alterados para trabajar con CEST zona horaria (zona horaria offset: UTC + 2 horas):

var offset = -(currentDate.getTimezoneOffset()/60 + 2); 

y así sucesivamente.

Answer 3

Cuando he usado esto, he tenido que cambiar la línea

var hours = givenDate.getHours(); 

a

var hours = givenDate.getUTCHours(); 

Al depurar a través de este, la línea var givenDate = new Date(tagText) termina por crear un objeto Date que es en UTC (si le das una fecha en formato RFC1123, por ejemplo, ddd, dd MMM yyyy HH:mm:ss GMT), pero cuando llamas a getHours, obtienes las horas en la zona horaria local. Entonces, a menos que llame a getUTCHours, no funciona.

Así que lo más completa es

/* 
    Note: this requires that the JQuery-DateFormat plugin be loaded first 
    http://plugins.jquery.com/project/jquery-dateFormat 
*/ 

(function ($) { 
    $.fn.localTimeFromUTC = function (format) { 

     return this.each(function() { 

      // get time offset from browser 
      var currentDate = new Date(); 
      var offset = -(currentDate.getTimezoneOffset()/60); 

      // get provided date 
      var tagText = $(this).html(); 
      var givenDate = new Date(tagText); 

      // apply offset 
      var hours = givenDate.getUTCHours(); 
      hours += offset; 
      givenDate.setHours(hours); 

      // format the date 
      var localDateString = $.format.date(givenDate, format); 
      $(this).html(localDateString); 
     }); 
    }; 
})(jQuery); 

Ver this other question de como lo he usado en combinación con el plugin timeago.

Answer 4

Use la fecha de entrada para buscar el desplazamiento de la zona horaria. Importante para los cambios de horario de verano.

(function ($) { 
$.fn.localTimeFromUTC = function (format) { 
    return this.each(function() { 

     // get provided date 
     var tagText = $(this).html(); 
     var givenDate = new Date(tagText); 

     if(givenDate == 'NaN') return; 

     // get time offset from browser 
     var offset = -(givenDate.getTimezoneOffset()/60); 

     // apply offset 
     var hours = givenDate.getHours(); 
     hours += offset; 
     givenDate.setHours(hours); 

     // format the date 
     var localDateString = $.format.date(givenDate, format); 
     $(this).html(localDateString); 


    }); 
}; 
})(jQuery); 

Se usa como ....

function ConvertDatesToLocalTime() { 
     $('.ConvertUtcToLocal').localTimeFromUTC('MM/dd/yyyy hh:mm:ss a'); 
    } 

    $(document).ready(function() { 
     ConvertDatesToLocalTime(); 

    }); 

clase Asignar 'ConvertUtcToLocal' a todos los elementos que requieren conversión.

Answer 5

$(".localdatetime").each(function() { 
     var datestr = $(this).text(); 
     //alert(datestr); 
     if (datestr.trim() != '') { 
      var dateOb = (new Date(Date.parse(datestr, 'MM-dd-yyyy HH:mm'))).setTimezone("GMT").toString('dd MMM yyyy hh:mm tt'); 
      //alert(dateOb); 
      $(this).text(dateOb); 
     } 
    }) 

esto también se puede utilizar junto con la biblioteca Date.js para mostrar la hora en la zona horaria del usuario