Pasar a Segundos, minutos, horas, dias, semanas, meses y años
Publicado por Geraldine (1 intervención) el 17/04/2019 23:29:38
Buenas tardes, quería saber como puedo configurar un grupo de botones para que, al yo ingresar en un cuadro de texto el número con los botones indique que si es minutos, segundos,etc y que lo voy a transformar en horas, semanas,etc.
Esto es lo que llevo hecho:
HTML
Css
Javascript
Esto es lo que llevo hecho:
HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!--Titulo de la pagina--><title>Convertidor</title>
<!--Llamamos a las clases--><link rel="stylesheet" type="text/css" href="styleConver.css">
<script type="text/javascript" src="operaciones.js"></script>
</head>
<body>
<form name="conversion">
<!--Titulo dentro de la pagina--><center>
<h1>Convertidor de Tiempo</h1>
<!-- Creamos el formato "div" para usar las hojas de estilo con los labels --><div class="contenido">
<!--Informacion--><label>En primer lugar, ingrese el numero que desee convertir aqui:</label>
<br>
<!-- Creamos el cuadro de texto --><input id="numero" type="text" name="numero" placeholder="Ingrese el digito">
</div>
<!-- Creamos un "div" para usar las hojas de estilo con los botones --><div class="botones">
<label>A continuacion, haga clic en los botones de opcion para la conversion<label>
<!-- Creamos los botones De:--><br>De:
<button onclick="segundos()" id="segundos" class="boton">Segundos</button>
<button onclick="minutos()" id="minutos" class="boton">Minutos</button>
<button onclick="horas()" id="horas" class="boton">Horas</button>
<button onclick="dias()" id="dias" class="boton">Dias</button>
<button onclick="semanas()" id="semanas" class="boton">Semanas</button>
<button onclick="meses()" id="meses" class="boton">Meses</button>
<button onclick="años()" id="años" class="boton">Años</button>
<!-- Creamos los botones A:--><br>A:
<button onclick="segundos2()" id="segundos" class="boton">Segundos</button>
<button onclick="minutos2()" id="minutos" class="boton">Minutos</button>
<button onclick="horas2()" id="horas" class="boton">Horas</button>
<button onclick="dias2()" id="dias" class="boton">Dias</button>
<button onclick="semanas2()" id="semanas" class="boton">Semanas</button>
<button onclick="meses2()" id="meses" class="boton">Meses</button>
<button onclick="años2()" id="años" class="boton">Años</button>
<br>
<!-- Creamos el cuadro donde mostrara el resultado --><input id="solucion" type="text" name="resultado">
<br>
<!-- Creamos los botones Calcular y Limpiar:--><div class="Calcular_Limpiar">
<button onclick="calcular()" id="calcular" class="boton">Calcular</button>
<button onclick="limpiar()" id="limpiar" class="boton">Limpiar</button>
</div>
</div>
</form>
</center>
</body>
</html>
Css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
#numero{
margin-top:6px;
margin-bottom: 4px;
}#solucion{
margin-top:6px;
margin-bottom: 4px;
}#solucion{
margin-top:10px;
}#calcular{
background: #ecf0f1;
color: #FF0099;
font-size: 18px;
border: 0px;word-spacing:0.225em;
}#limpiar{
background: #ecf0f1;
color: #FF0099;
font-size: 18px;
border: 0px;}.contenido{
align-content: center;
background: #ecf0f1;
border: 1px solid #000;
border-radius: 2%;
padding: 4px;padding-bottom: 6px;
margin-left: 28%;
margin-right: 28%;
}.botones{
align-content: center;
background: #ecf0f1;
border: 1px solid #000;
border-radius: 2%;
padding: 4px;padding-bottom: 6px;
margin-left: 28%;
margin-right: 28%;
}.boton{
margin-top:5px;
margin-bottom: 1px;
background: #CCCCCC;
border: 1px solid #000;
border-radius: 2%;
padding-top: 10px;
padding: 6px;border-radius: 5%;
font-family: calibri bold;
font-size: 14px;
}Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
//Creamos una funcion
function limpiar(){
//Declaramos un metodo que viene por default:
clearInterval(Conversion_tiempo);
}function segundos(){
}function calcular(){
//Declaramos una variable:
var numero=(document.conversion.numero.value)*1;
if (numero==0) {
alert("Se ha detectado el espacio en blanco, por favor ingrese un digito");
}else if (segundos) {}{
}}Valora esta pregunta
0
