Como Insertar hora similiar a calendario fecha

teudiss · #1 (**permalink**) 23/06/2010, 01:36

Hola, en mi web tengo un campo fecha que al pinchar se abre un calendatio y se inserta la fecha muy comodamente.

Hay alguna forma de hacer lo mismo en otro campo que tengo de "hora:minutos", que se pueda poner la hora como por ejemplo como cuando la cambias en windows ?

gracias

Adler · #2 (**permalink**) 23/06/2010, 06:32

Hola

¿Te refieres a esto?

Código Javascript:

Ver original<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
var ns4 = (document.layers)? true:false
var ie4 = (document.all)? true:false
var ns6 = (document.getElementById)? true:false
function captura_objeto(idnombre) {
    if (ns6)
    {
    return document.getElementById(idnombre);
    }
    else if (ie4)
    {
    return document.all[idnombre];
    }
    else if (ns4)
    {
    return document.layers[idnombre];
    }
    else
    {
    return null;
    }
}
 
var hora_sin_formato = "";
function muestraReloj()
{
// Compruebo si se puede ejecutar el script en el navegador del usuario
if (!ns4 && !ie4 && !ns6) return;
// Obtengo la hora actual y la divido en sus partes
var fechacompleta = new Date();
var horas = fechacompleta.getHours();
var minutos = fechacompleta.getMinutes();
var segundos = fechacompleta.getSeconds();
var mt = "AM";
// Pongo el formato 12 horas
if (horas > 12) {
mt = "PM";
horas = horas - 12;
}
if (horas == 0) horas = 12;
// Pongo minutos y segundos con dos dígitos
if (minutos <= 9) minutos = "0" + minutos;
if (segundos <= 9) segundos = "0" + segundos;
// En la variable 'cadenareloj' puedes cambiar los colores y el tipo de fuente
hora_sin_formato = horas + ":" + minutos + ":" + segundos + " " + mt 
cadenareloj = "<font size='1' face='verdana' ><b>" + horas + ":" + minutos + ":" + segundos + " " + mt + "</b></font>";
// Escribo el reloj de una manera u otra, según el navegador del usuario
if (ns4) {
captura_objeto("spanreloj").document.write(cadenareloj);
captura_objeto("spanreloj").document.close();
}
else if (ie4) captura_objeto("spanreloj").innerHTML = cadenareloj;
else if (ns6) captura_objeto("spanreloj").innerHTML = cadenareloj;
// Ejecuto la función con un intervalo de un segundo
setTimeout("muestraReloj()", 1000);
captura_objeto("spanreloj").onclick = recogeHora
}
 
// Fin del script -->
 
function recogeHora() {
captura_objeto("reloj").value = hora_sin_formato;
}
</script>
</head>
 
<body onLoad="muestraReloj()">
<div id="spanreloj" style="position:absolute;left:20;top:20;"></div>
<br /><br />
<input type="text" id="reloj" value="" />
</body>
</html>

Suerte

teudiss · #3 (**permalink**) 24/06/2010, 00:23

hola Adler, gracias por tu respuesta pero no es eso lo que busco.

Lo que quiero es insertar en ese mismo campo de texto la hora mediante botones, similar a cuando cambias la hora en windows.

Por ejemplo un boton + para incrementar hora y minutos y un boton - para disminuir.

Adler · #4 (**permalink**) 24/06/2010, 14:53

Hola

A ver si es esto lo que buscas

Código Javascript:

Ver original<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
var milsegundos = 0;
 
var ns4 = (document.layers)? true:false
var ie4 = (document.all)? true:false
var ns6 = (document.getElementById)? true:false
function captura_objeto(idnombre) {
    if (ns6)
    {
    return document.getElementById(idnombre);
    }
    else if (ie4)
    {
    return document.all[idnombre];
    }
    else if (ns4)
    {
    return document.layers[idnombre];
    }
    else
    {
    return null;
    }
}
 
 
 
function muestraReloj() {
var fechacompleta = new Date();
var horas = fechacompleta.getHours();
var minutos = fechacompleta.getMinutes();
var segundos = fechacompleta.getSeconds();
var hmisengundos = horas*60*60*1000;
var mmisengundos = minutos*60*1000;
var smisengundos = segundos*1000;
milsegundos = hmisengundos + mmisengundos + smisengundos;
if (minutos <= 9) minutos = "0" + minutos;
if (segundos <= 9) segundos = "0" + segundos;
intervalo = setTimeout("muestraReloj(), 1000");
captura_objeto("reloj").value = horas + ":" + minutos + ":" + segundos;
}
 
 
function VariarHora (accion) {
clearTimeout(intervalo);
if (accion == 'restar'){milsegundos -= 1000;}
if (accion == 'sumar'){milsegundos += 1000;}
segundostotales = parseInt(milsegundos/1000);
minutostotales = parseInt(segundostotales/60);
horas = parseInt(minutostotales/60);
minutos = parseInt(minutostotales &#37; 60);
segundos = parseInt(segundostotales % 60);
if (minutos <= 9) minutos = "0" + minutos;
if (segundos <= 9) segundos = "0" + segundos;
captura_objeto("reloj").value = horas + ":" + minutos + ":" + segundos;
}
</script>
</head>
<body onLoad="muestraReloj()">
<input type="text" id="reloj" value="" />
<input type="button" onclick="VariarHora('sumar')" value="+" />
<input type="button" onclick="VariarHora('restar')" value="-" />
</body>
</html>

Suerte

teudiss · #5 (**permalink**) 25/06/2010, 08:04

Si, es esto justo lo que busco, solo que no muestra nada en el campo de texto, no deberia mostrar el reloj ? estoy tratando de hacer que aparezca pero no hay forma.....

Adler · #6 (**permalink**) 25/06/2010, 08:11

Hola

Ha sido un problema en la conversión que hace este foro de "%": Esta en la línea 54

Suerte

teudiss · #7 (**permalink**) 25/06/2010, 09:52

Perdona mi ignorancia pero sigue igual.

Cita:

minutos = parseInt(minutostotales % 37; 60);
segundos = parseInt(segundostotales % 60);

no funciona......:(

Adler · #8 (**permalink**) 25/06/2010, 12:15

Hola

En la línea 54 donde aparece & # 3 7 ; (lo separo para que no sea interpretado)lo sustituyes por el tanto por cierto %. Además si la consola de error te dice nada mas abrir la página, o ¿piensas que yo he estado revisando línea por línea?

Suerte

teudiss · #9 (**permalink**) 30/06/2010, 02:31

Gracias por tu tiempo Adler, ya muestra la hora, con los botones solo puedo incrementar los segundo, como seria para incrementar tambien la hora y minutos..... ?

Adler · #10 (**permalink**) 30/06/2010, 07:11

Hola

Ya te he dado dos códigos. Ahora llegó tu turno de trabajar por lo que quieres. Estudia el código que ahí tienes la respuesta

Suerte