Cómo obtener la hora actual con jQuery


129

Lo siguiente devuelve el tiempo en microsegundos, por ejemplo 4565212462.

alert( $.now() );

¿Cómo lo convierto a un formato de hora legible para humanos, como (horas: minutos: segundos) ?


1
No necesita jQuery $.now()ya que JavaScript tiene una implementación nativa: stackoverflow.com/questions/20456712/…
Josh Crozier el

Correcciones: (1) Esto ha sido reemplazado con el Date.now () nativo, y (2) El tiempo devuelto es en milisegundos, no en microsegundos.
den232

Respuestas:


304

Puedes intentarlo así:

new Date($.now());

También usando Javascript puedes hacer así:

var dt = new Date();
var time = dt.getHours() + ":" + dt.getMinutes() + ":" + dt.getSeconds();
document.write(time);


77
Tenga en cuenta que .getHours () devuelve las horas en la zona horaria de la máquina local. Si el usuario tiene su navegador en una zona horaria distinta a la suya, obtendrá otros resultados de getHours. Esto también es válido para el método .toString (). Controlar la zona horaria en javascript es complicado (debe calcular el desplazamiento entre su zona horaria y la deseada y modificar la fecha en consecuencia). Entonces, como se mencionó en otra respuesta, usar moment.js parece una buena idea. momentjs.com
Chris

1
También debe considerar incluir padStart para cada get: dt.getMinutes (). ToString.padStart (2, '0') Esto asegurará que los números permanezcan con 2 dígitos de largo con un cero rellenado, y siga la funcionalidad propuesta de JavaScript, muy bonito a prueba de futuro: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
Negative Zero

2
@NegativeZero Una sugerencia realmente útil (si no esencial). Desafortunadamente no me funcionó en Firefox (no probé en otros navegadores). Sin embargo, reescribirlo como String (dt.getMinutes ()). PadStart (2, '0') funciona para mí.
biscuitstack

54

Debes buscar todos los "números" manualmente

Me gusta esto:

var currentdate = new Date(); 
    var datetime = "Now: " + currentdate.getDate() + "/"
                + (currentdate.getMonth()+1)  + "/" 
                + currentdate.getFullYear() + " @ "  
                + currentdate.getHours() + ":"  
                + currentdate.getMinutes() + ":" 
                + currentdate.getSeconds();

document.write(datetime);


39

Convierta un Dateobjeto en una cadena, utilizando uno de Date.prototypelos captadores de conversión , por ejemplo:

var d = new Date();
d+'';                  // "Sun Dec 08 2013 18:55:38 GMT+0100"
d.toDateString();      // "Sun Dec 08 2013"
d.toISOString();       // "2013-12-08T17:55:38.130Z"
d.toLocaleDateString() // "8/12/2013" on my system
d.toLocaleString()     // "8/12/2013 18.55.38" on my system
d.toUTCString()        // "Sun, 08 Dec 2013 17:55:38 GMT"

O, si lo desea más personalizado, consulte la lista de Date.prototypemétodos getter .


25

¡No necesitas usar jQuery para esto!

La implementación nativa de JavaScript esDate.now() .

Date.now()y $.now()devuelve el mismo valor:

Date.now(); // 1421715573651
$.now();    // 1421715573651
new Date(Date.now())   // Mon Jan 19 2015 20:02:55 GMT-0500 (Eastern Standard Time)
new Date($.now());     // Mon Jan 19 2015 20:02:55 GMT-0500 (Eastern Standard Time)

..y si desea que la hora esté formateada en hh-mm-ss:

var now = new Date(Date.now());
var formatted = now.getHours() + ":" + now.getMinutes() + ":" + now.getSeconds();
// 20:10:58

1
No necesita proporcionar parámetros a la nueva Fecha (), ya que ahora está predeterminada.
Andrew Spode

1
@Spode Ah, buen punto. No estoy seguro de por qué otras respuestas estaban usando jQuery entonces.
Josh Crozier

17

.clock {
width: 260px;
margin: 0 auto;
padding: 30px;
color: #FFF;background:#333;
}
.clock ul {
width: 250px;
margin: 0 auto;
padding: 0;
list-style: none;
text-align: center
}

.clock ul li {
display: inline;
font-size: 3em;
text-align: center;
font-family: "Arial", Helvetica, sans-serif;
text-shadow: 0 2px 5px #55c6ff, 0 3px 6px #55c6ff, 0 4px 7px #55c6ff
}
#Date { 
font-family: 'Arial', Helvetica, sans-serif;
font-size: 26px;
text-align: center;
text-shadow: 0 2px 5px #55c6ff, 0 3px 6px #55c6ff;
padding-bottom: 40px;
}

#point {
position: relative;
-moz-animation: mymove 1s ease infinite;
-webkit-animation: mymove 1s ease infinite;
padding-left: 10px;
padding-right: 10px
}

/* Animasi Detik Kedap - Kedip */
@-webkit-keyframes mymove 
{
0% {opacity:1.0; text-shadow:0 0 20px #00c6ff;}
50% {opacity:0; text-shadow:none; }
100% {opacity:1.0; text-shadow:0 0 20px #00c6ff; } 
}

@-moz-keyframes mymove 
{
0% {opacity:1.0; text-shadow:0 0 20px #00c6ff;}
50% {opacity:0; text-shadow:none; }
100% {opacity:1.0; text-shadow:0 0 20px #00c6ff; } 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// Making 2 variable month and day
var monthNames = [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ]; 
var dayNames= ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"]

// make single object
var newDate = new Date();
// make current time
newDate.setDate(newDate.getDate());
// setting date and time
$('#Date').html(dayNames[newDate.getDay()] + " " + newDate.getDate() + ' ' + monthNames[newDate.getMonth()] + ' ' + newDate.getFullYear());

setInterval( function() {
// Create a newDate() object and extract the seconds of the current time on the visitor's
var seconds = new Date().getSeconds();
// Add a leading zero to seconds value
$("#sec").html(( seconds < 10 ? "0" : "" ) + seconds);
},1000);

setInterval( function() {
// Create a newDate() object and extract the minutes of the current time on the visitor's
var minutes = new Date().getMinutes();
// Add a leading zero to the minutes value
$("#min").html(( minutes < 10 ? "0" : "" ) + minutes);
},1000);

setInterval( function() {
// Create a newDate() object and extract the hours of the current time on the visitor's
var hours = new Date().getHours();
// Add a leading zero to the hours value
$("#hours").html(( hours < 10 ? "0" : "" ) + hours);
}, 1000); 
});
</script>
<div class="clock">
<div id="Date"></div>
<ul>
<li id="hours"></li>
<li id="point">:</li>
<li id="min"></li>
<li id="point">:</li>
<li id="sec"></li>
</ul>
</div>


9

jQuery.now() Devoluciones: Número

Descripción: Devuelve un número que representa la hora actual.

Este método no acepta ningún argumento.

El $.now()método es una forma abreviada del número devuelto por la expresión (new Date).getTime().

http://api.jquery.com/jQuery.now/

Es simple usar Javascript:

var d = new Date();
var time = d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds();
console.log(time);

5

$ .now () de jQuery es un alias de la nueva fecha (). getTime (), una función interna de Javascript.

http://api.jquery.com/jquery.now/

Esto devuelve el número de segundos transcurridos desde 1970, comúnmente conocido (no necesariamente correctamente) como Unix Time, Epoch o Timestamp, dependiendo de los círculos en los que se encuentre. Puede ser realmente útil para calcular la diferencia entre fechas / horas usando cálculos matemáticos simples . No tiene ninguna información de TimeZone y siempre es UTC.

http://en.wikipedia.org/wiki/Unix_time

No es necesario usar jQuery como otro alias, hace poco más para ayudar con la manipulación de fecha / hora.

Si está buscando una manera rápida y sucia de representar la hora en el texto, el objeto Fecha de Javascript tiene un prototipo "toString" que devolverá una Fecha y hora con formato ISO.

new Date().toString();
//returns "Thu Apr 30 2015 14:37:36 GMT+0100 (BST)"

Sin embargo, lo más probable es que desee personalizar su formato. El objeto Date tiene la capacidad de extraer sus detalles relevantes para que pueda construir su propia representación de cadena.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date

var d = new Date(); //without params it defaults to "now"
var t = d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds();
//Will return 14:37:36

Sin embargo, como ha pedido una solución jQuery, es probable que esté trabajando con navegadores más antiguos. Si desea hacer cosas más específicas, especialmente interpretando cadenas en objetos Date (útiles para las respuestas de la API), es posible que desee ver Moment.js.

http://momentjs.com/

¡Esto asegurará la compatibilidad entre navegadores y tiene un formato mucho mejor sin tener que concatenar muchas cadenas juntas! Por ejemplo:

moment().format('hh:mm:ss');
//Will return 14:37:36

4

Utilizo momento para todas mis necesidades de manipulación / visualización de tiempo (tanto del lado del cliente como de node.js si lo usa), si solo necesita un formato simple, las respuestas anteriores lo harán, si está buscando algo un poco más complejo, momento es el camino a seguir en la OMI.


3
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
</script>
<script>
    function ShowLocalDate()
    {
    var dNow = new Date();
    var localdate= (dNow.getMonth()+1) + '/' + dNow.getDate() + '/' + dNow.getFullYear() + ' ' + dNow.getHours() + ':' + dNow.getMinutes();
    $('#currentDate').text(localdate)
    }
</script>

</head>
<body>
    enter code here
    <h1>Get current local enter code here Date in JQuery</h1>
    <label id="currentDate">This is current local Date Time in JQuery</p>
    <button type="`enter code here button onclick="ShowLocalDate()">Show Local DateTime</button>

</body>
</html> 

puedes obtener más información en el siguiente enlace

http://www.morgantechspace.com/2013/11/Get-current-Date-time-in-JQuery.html#GetLocalDateTimeinJQuery




0

Para la hora local en ISO8601SQL TIMESTAMP, puede intentar:

var tzoffset = (new Date()).getTimezoneOffset() * 60000;
var localISOTime = (new Date(Date.now() - tzoffset))
  .toISOString()
  .slice(0, 19)
  .replace('T', ' ');
$('#mydatediv').val(localISOTime);


0

<p id="date"></p>

<script>
var d = new Date();
document.getElementById("date").innerHTML = d.toTimeString();
</script>

Puede usar Date () en JS.


0

El seguimiento

function gettzdate(){
    var fd = moment().format('YYYY-MM-DDTHH:MM:ss');
    return fd ; 
}

funciona para forzar la fecha actual en un <input type="datetime-local">

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.