Contenedor para fecha y hora- Gracias

datcom · #1 (**permalink**) 26/07/2011, 16:06

Hola amigos y hermanos!

Necesito crear un contenedor para poner la fecha y la hora, que me recomiendan?

Tengo esto

Código HTML:

Código Javascript:

<script type="text/javascript"> 
    
    //Autor: Iván Nieto Pérez
    
    //Función para la fecha
  
function MostrarFecha()  
   {  
   var nombres_dias = new Array("Domingo", "Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado")  
   var nombres_meses = new Array("Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre")  
  
   var fecha_actual = new Date()  
  
   dia_mes = fecha_actual.getDate();
   dia_semana = fecha_actual.getDay(); 
   mes = fecha_actual.getMonth() + 1;  
   anio = fecha_actual.getFullYear();  
   
   document.write(nombres_dias[dia_semana] + ", " + dia_mes + " de " + nombres_meses[mes - 1] + " de " + anio)  
   }  
   
   //Función para el reloj
 
var RelojID12 = null
var RelojEjecutandose12 = false
 
function DetenerReloj12 () {
    if(RelojEjecutandose12)
        clearTimeout(RelojID12)
    RelojEjecutandose12 = false
}
 
function MostrarHora12 () {
    var ahora = new Date()
    var horas = ahora.getHours()
    var minutos = ahora.getMinutes()
    var segundos = ahora.getSeconds()
    var meridiano
 
    //ajusta las horas
    if (horas > 12) {
        horas -= 12
        meridiano = " P.M."
    } else {
        meridiano = " A.M."
        }
            
    //establece las horas
    if (horas < 10)
        ValorHora = "0" + horas
    else
        ValorHora = "" + horas
 
    //establece los minutos
    if (minutos < 10)
        ValorHora += ":0" + minutos
    else
        ValorHora += ":" + minutos
            
    //establece los segundos
    if (segundos < 10)
        ValorHora += ":0" + segundos
    else
        ValorHora += ":" + segundos
        
    ValorHora += meridiano
    document.reloj12.digitos.value = ValorHora
 
    //si se desea tener el reloj en la barra de estado, reemplazar la anterior por esta
    //window.status = ValorHora
 
    RelojID12 = setTimeout("MostrarHora12()",1000)
    RelojEjecutandose12 = true
}
 
function IniciarReloj12 () {
    DetenerReloj12()
    MostrarHora12()
}
 
window.onload = IniciarReloj12;
if (document.captureEvents) {           //N4 requiere invocar la funcion captureEvents
    document.captureEvents(Event.LOAD)
}
 
   
</script>


y para usarlas:

La fecha

Código Javascript:
Ver originalCopiar
<script type="text/javascript">
    MostrarFecha();
</script>

y la hora:

Código HTML:
Ver originalCopiar
<div class="recuadro3">  
<form name="reloj12">  
<input type="text" size="14" name="digitos">  
</form>
</div>

Como lo meto en un contenedor, tabla, div como lo hago?

emprear · #2 (**permalink**) 27/07/2011, 00:52

Bueno, eso que tenés esta bastante explicito, para implementarlo

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Reloj Dinámico</title> 
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript"> 
    //Autor: Iván Nieto Pérez
    //Función para la fecha
 
function MostrarFecha()  
   {  
   var nombres_dias = new Array("Domingo", "Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado")  
   var nombres_meses = new Array("Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre")  
  
   var fecha_actual = new Date()  
  
   dia_mes = fecha_actual.getDate();
   dia_semana = fecha_actual.getDay(); 
   mes = fecha_actual.getMonth() + 1;  
   anio = fecha_actual.getFullYear();  
   
   document.write(nombres_dias[dia_semana] + ", " + dia_mes + " de " + nombres_meses[mes - 1] + " de " + anio)  
   }  
   
   //Función para el reloj
 
var RelojID12 = null
var RelojEjecutandose12 = false
 
function DetenerReloj12 () {
    if(RelojEjecutandose12)
        clearTimeout(RelojID12)
    RelojEjecutandose12 = false
}
 
function MostrarHora12 () {
    var ahora = new Date()
    var horas = ahora.getHours()
    var minutos = ahora.getMinutes()
    var segundos = ahora.getSeconds()
    var meridiano
 
    //ajusta las horas
    if (horas > 12) {
        horas -= 12
        meridiano = " P.M."
    } else {
        meridiano = " A.M."
        }
            
    //establece las horas
    if (horas < 10)
        ValorHora = "0" + horas
    else
        ValorHora = "" + horas
 
    //establece los minutos
    if (minutos < 10)
        ValorHora += ":0" + minutos
    else
        ValorHora += ":" + minutos
            
    //establece los segundos
    if (segundos < 10)
        ValorHora += ":0" + segundos
    else
        ValorHora += ":" + segundos
        
    ValorHora += meridiano
document.getElementById('digitos').innerHTML = ValorHora;
 
    RelojID12 = setTimeout("MostrarHora12()",1000)
    RelojEjecutandose12 = true
}
 
function IniciarReloj12 () {
    DetenerReloj12()
    MostrarHora12()
}
 
window.onload = IniciarReloj12;
if (document.captureEvents) {           //N4 requiere invocar la funcion captureEvents
    document.captureEvents(Event.LOAD)
}
</script>
</head>
<body>
<p>
<script type="text/javascript">
MostrarFecha();
</script>
</p>
<div id="digitos"><!-- reloj --></div>
</body>
</html>

En resumen en el body llamas la funcion MostrarFecha() y para que aparezca la hora creas un div con id="digitos", despues lo adornas con un poco de css.
PEro tené en cuenta que con javascript estás mostrando la fecha y hora de la máquina del cliente. Algo más fiable, deberías hacerlo con php

Saludos

datcom · #3 (**permalink**) 27/07/2011, 08:48

gracias!, entonces este tema lo damos por cerrado voy ahora a php haber como hacer la fecha como me decis vos mas confiable desde un php.

PD: si sabes de un tema que ya hable de eso en el foro, me linkeas?

Gracias

emprear · #4 (**permalink**) 27/07/2011, 09:27

Aquí:
http://www.forosdelweb.com/f18/impre...2/#post3929562

Para crear un reloj con php con algo de dinamismo, (que actualice cada minuto, por ejemplo) es un poco más complejo, porque necesitas ajax.
Fijate por ahora lo de la fecha

Saludos