Foros del Web » Creando para Internet » HTML »

Box calculador

 Estas en el tema de Box calculador en el foro de HTML en Foros del Web. Hola, Soy nuevo en esto de las paginas web. Me gustaria hacer "un conversor" La idea es que al poner un numero en un box, ...
  #1 (permalink)  
Antiguo 02/04/2011, 07:21
 
Fecha de Ingreso: enero-2011
Mensajes: 59
Antigüedad: 13 años, 3 meses
Puntos: 2
Box calculador
Hola,

Soy nuevo en esto de las paginas web.
Me gustaria hacer "un conversor"
La idea es que al poner un numero en un box, en otro box me salga lo que correponda

No me explico bien...

Seria algo parecido a este codigo:
<title>Puntos de Experiencia, nivel</title>
<meta value="[email protected]" name="author"> <SCRIPT LANGUAGE="JavaScript">
<!-- Hide scripts from old browsers

function reload()
{
location.reload();
}
function Decimal_to_binary(x)
{
answer=new Object();
x2=x;
log2=0;
while(x2>=2){
x2=x2/2;
log2=log2+1;
}

for(l2=log2; l2>=0; l2--){
power=Math.pow(2,l2);
if (x>=power) {
answer[l2]="1";
x=x-power;
}
else answer[l2]="0";
}
for (i=log2; i>=0; i--){
document.forms[0].elements[1].value+=(answer[i]);

}
}
function Binary_to_decimal(x)
{

y=parseInt(x,2);
if (isNaN(y))
alert(x + " no es un nº binario!");
else
document.forms[1].elements[1].value=y;
}

function explaindec(x)
{

var ex = open("","explanation","width=300,height=150,scroll bars=yes");

ex.document.write("El nº <FONT COLOR=BLUE>" + x +"</FONT>");
answer=new Object();
x2=x;
log2=0;
while(x2>=2){
x2=x2/2;
log2=log2+1;
}
ex.document.write(" Se puede expresar: <BR><FONT COLOR=BLUE>");
for(l2=log2; l2>=0; l2--){
power=Math.pow(2,l2);
if (x>=power) {
answer[l2]="1";
x=x-power;
if (l2<log2)
ex.document.write(" " + "+" + " ");
ex.document.write(power);
}
else answer[l2]="0";
}
ex.document.write("</FONT><BR>La solución es: ");
ex.document.write("<FONT COLOR=RED>");
for (i=log2; i>=0; i--){
ex.document.write(answer[i]);
}

ex.document.write("</FONT> ");
ex.document.write("<P>");
ex.document.write("<FORM>");
ex.document.write("<INPUT TYPE=BUTTON VALUE='Continuar' onClick='window.close()'>");
ex.document.write("</FORM>");
}

function explainbin(x)
{


y=parseInt(x,2);
if (isNaN(y)){
alert(x + " no es un nº binario");
return;
}

var ex = open("","explanation","width=300,height=150,scroll bars=yes");
ex.document.write("El nº <FONT COLOR=BLUE>" + x +"</FONT>");
ex.document.write(" representa: <BR><FONT COLOR=BLUE>");
hipow=x.length-1;
for(l=0;l<x.length;l++){
digit=x.substring(l,l+1);
if (digit=='1'){
power=Math.pow(2,hipow-l);
if (l>0)
ex.document.write(" " + "+" + " ");
ex.document.write(power);
}
}
ex.document.write("</FONT><BR>la solución es: ");
ex.document.write("<FONT COLOR=RED>");
ex.document.write(y);
ex.document.write("</FONT> ");
ex.document.write("<P>");
ex.document.write("<FORM>");
ex.document.write("<INPUT TYPE=BUTTON VALUE='Continuar' onClick='window.close()'>");
ex.document.write("</FORM>");
}

function answer(correct,which) {
if (document.forms[0].elements[which].value == correct) {
alert("Correcto!");
}
else {
alert("Prueba otra vez.");
}
}
function give(correct,which) {

document.forms[0].elements[which].value = correct;
}
//End hide -->
</SCRIPT>
<h3>Javascript, calculadora binario/decimal</h3>
<hr />
<font size="2"> </font>
<p><font size="2"> </font></p>
<form name="dectobin">
N&ordm; Decimal a convertir: <input maxlength="7" size="7" name="dec" /> <br />
Representaci&oacute;n Binaria: <input type="bin" readonly="readonly" input="" maxlength="25" size="25" name="bin" /> <br />
<input type="button" onclick="Decimal_to_binary(document.forms[0].elements[0].value)" value="Convertir" /> <input type="button" onclick="explaindec(document.forms[0].elements[0].value)" value="&iquest;Porque?" /> <br />
<br />
<input type="Reset" onclick="reload()" value="Otra Vez!" />
</form>
<form name="bintodec">
N&ordm; Binario a convertir: <input maxlength="24" size="24" name="dec" /> <br />
Represenaci&oacute;n Decimal: <input type="bin" readonly="readonly" input="" maxlength="7" size="7" name="bin" /> <br />
<input type="button" onclick="Binary_to_decimal(document.forms[1].elements[0].value)" value="Convertir" /> <input type="button" onclick="explainbin(document.forms[1].elements[0].value)" value="&iquest;Porqu&eacute;?" /> <br />
<br />
<input type="Reset" value="Otra Vez!" />
</form>
</meta>

Aqui lo pueden ver:
http://clandeaprendices.es.tl/Pagina-de-pruebas.htm


Al darle a convertir pasa ese numero a numero binario

Pues yo quiero que al darle a convertir, dependiendo del numero de arriba abajo ponga otro...(que mal me explico)

Por ejemplo

Del numero 1 al 20
y en el segundo que ponga
Nivel: 1

Del numero 21 al 40
Y en el segundo box que ponga
Nivel: 2

y asi...

Un saludo!

Y disculpen por no saber nada sobre esto
  #2 (permalink)  
Antiguo 03/04/2011, 13:25
Avatar de laratik  
Fecha de Ingreso: mayo-2010
Ubicación: Cali
Mensajes: 317
Antigüedad: 13 años, 10 meses
Puntos: 63
Respuesta: Box calculador
Algo como esto:

Código HTML:
<html>
	<head>
		<title>Puntos de Experiencia, nivel</title>
		<script type="text/javascript">
			function convertir() {
				var num = document.getElementById("num").value;
				try {
					num = parseInt(num);
					document.getElementById("res").value = Math.ceil(num/20);
				} catch (e) {
					alert("Digite un numero valido");
				}
			}
		</script>
	</head>
	
	<body>
		<label>Numero: </label><input type="text" id="num" /><br/><br/>
		<label>Nivel: </label><input type="text" id="res" disabled="true" /><br/><br/>
		<input type="button" value="Convertir" onclick="convertir()">
	</body>
</html>
__________________
Programar apasiona y lo que apasiona es un arte, por lo tanto programar es un arte.

Quiero karma para en mi próxima vida ser un billonario bien dotado con alas.
  #3 (permalink)  
Antiguo 04/04/2011, 10:36
 
Fecha de Ingreso: enero-2011
Mensajes: 59
Antigüedad: 13 años, 3 meses
Puntos: 2
Respuesta: Box calculador
Cita:
Iniciado por laratik Ver Mensaje
Algo como esto:

Código HTML:
<html>
	<head>
		<title>Puntos de Experiencia, nivel</title>
		<script type="text/javascript">
			function convertir() {
				var num = document.getElementById("num").value;
				try {
					num = parseInt(num);
					document.getElementById("res").value = Math.ceil(num/20);
				} catch (e) {
					alert("Digite un numero valido");
				}
			}
		</script>
	</head>
	
	<body>
		<label>Numero: </label><input type="text" id="num" /><br/><br/>
		<label>Nivel: </label><input type="text" id="res" disabled="true" /><br/><br/>
		<input type="button" value="Convertir" onclick="convertir()">
	</body>
</html>
Si, algo como eso

Pero no exactamente

Quiero que:

Del numero 1 al 9999 --- Nivel 1
Del 10000 al 19999 --- Nivel 2
Del 20000 al 39999 --- Nivel 3
Del 40000 al 79999 --- Nivel 4
Del 80000 al 159999 --- Nivel 5
Del 160000 al 319999 --- Nivel 6
Del 320000 al 639999 --- Nivel 7
Del 640000 al 1279999 --- Nivel 8
Del 1280000 al 2559999 --- Nivel 9
Del 2560000 al 5119999 --- Nivel 10
Del 5120000 al 10239999 --- Nivel 11
Del 10240000 al 20479999 --- Nivel 12
Del 20480000 al 40959999 --- Nivel 13
Del 40960000 al 81919999 --- Nivel 14
Del 81920000 al 163839999 --- Nivel 15
Del 163840000 al 327679999 --- Nivel 16
Del 327680000 al 655359999 --- Nivel 17
Del 655360000 al 1310720999 --- Nivel 18
Del 1310720000 al 2621440999 --- Nivel 19
Del 2621440000 al 5242880999 --- Nivel 20
Del 5242880000 al 10485760999 --- Nivel 21
Mas del nivel 21 que de error

Tambien me gustaria que se pudiera hacer al inverso
Es decir
Nivel 1 --- 10000
Nivel 2 --- 20000
Nivel 3 --- 40000
Nivel 4 --- 80000
Nivel 5 --- 160000
Y asi... (este numero se multiplica siempre por 2)

Haber si me lo pudieras resolver y si es mucho trabajo, solo ponme los huecos y yo "relleno"

Un saludo! y gracias
Última edición por Polkiko; 04/04/2011 a las 10:43
  #4 (permalink)  
Antiguo 04/04/2011, 15:16
Avatar de laratik  
Fecha de Ingreso: mayo-2010
Ubicación: Cali
Mensajes: 317
Antigüedad: 13 años, 10 meses
Puntos: 63
Respuesta: Box calculador
Para hacer lo que deseas debes replantear el algoritmo a algo como esto:

Código HTML:
<html>
	<head>
		<title>Puntos de Experiencia, nivel</title>
		<script type="text/javascript">
			function convertir() {
				var num = document.getElementById("num").value;
				try {
						num = parseInt(num);
						var nivel = 1;
						for (var i=10000; i<=10485760999; i*=2) {
							if(num<i) {
								document.getElementById("res").value = nivel;
								return;
							}
							nivel++;
						}
						document.getElementById("res").value = "ERROR";
				} catch (e) {
					alert("Digite un numero valido");
				}
			}
		</script>
	</head>
	
	<body>
		<label>Numero: </label><input type="text" id="num" /><br/><br/>
		<label>Nivel: </label><input type="text" id="res" disabled="true" /><br/><br/>
		<input type="button" value="Convertir" onclick="convertir()">
	</body>
</html>
__________________
Programar apasiona y lo que apasiona es un arte, por lo tanto programar es un arte.

Quiero karma para en mi próxima vida ser un billonario bien dotado con alas.
  #5 (permalink)  
Antiguo 04/04/2011, 23:17
 
Fecha de Ingreso: enero-2011
Mensajes: 59
Antigüedad: 13 años, 3 meses
Puntos: 2
Respuesta: Box calculador
Cita:
Iniciado por laratik Ver Mensaje
Para hacer lo que deseas debes replantear el algoritmo a algo como esto:

Código HTML:
<html>
	<head>
		<title>Puntos de Experiencia, nivel</title>
		<script type="text/javascript">
			function convertir() {
				var num = document.getElementById("num").value;
				try {
						num = parseInt(num);
						var nivel = 1;
						for (var i=10000; i<=10485760999; i*=2) {
							if(num<i) {
								document.getElementById("res").value = nivel;
								return;
							}
							nivel++;
						}
						document.getElementById("res").value = "ERROR";
				} catch (e) {
					alert("Digite un numero valido");
				}
			}
		</script>
	</head>
	
	<body>
		<label>Numero: </label><input type="text" id="num" /><br/><br/>
		<label>Nivel: </label><input type="text" id="res" disabled="true" /><br/><br/>
		<input type="button" value="Convertir" onclick="convertir()">
	</body>
</html>
Mucahs gracias por tu ayuda
Estudiaré el codigo que me as pasado, funciona a la perfeccion
  #6 (permalink)  
Antiguo 05/04/2011, 07:54
 
Fecha de Ingreso: enero-2011
Mensajes: 59
Antigüedad: 13 años, 3 meses
Puntos: 2
Respuesta: Box calculador
Probandolo y intentando hacerlo no se como hacer el inverso
Es decir que al escribir el nivel te salga los puntos necesarios para ser dicho nivel
Un saludo! y a ver si me ayudas...
  #7 (permalink)  
Antiguo 05/04/2011, 08:31
Avatar de laratik  
Fecha de Ingreso: mayo-2010
Ubicación: Cali
Mensajes: 317
Antigüedad: 13 años, 10 meses
Puntos: 63
Respuesta: Box calculador
Ya con el algoritmo que te di, es sencillo acondicionarlo:

Código HTML:
<html>
	<head>
		<title>Puntos de Experiencia, nivel</title>
		<script type="text/javascript">
			function convertir() {
				var num = document.getElementById("num").value;
				try {
						num = parseInt(num);
						var nivel = 1;
						for (var i=10000; i<=10485760999; i*=2) {
							if(num == nivel) {
								document.getElementById("res").value = i;
								return;
							}
							nivel++;
						}
						document.getElementById("res").value = "ERROR";
				} catch (e) {
					alert("Digite un numero valido");
				}
			}
		</script>
	</head>
	
	<body>
		<label>Nivel: </label><input type="text" id="num" /><br/><br/>
		<label>Numero: </label><input type="text" id="res" disabled="true" /><br/><br/>
		<input type="button" value="Convertir" onclick="convertir()">
	</body>
</html>
__________________
Programar apasiona y lo que apasiona es un arte, por lo tanto programar es un arte.

Quiero karma para en mi próxima vida ser un billonario bien dotado con alas.
  #8 (permalink)  
Antiguo 11/04/2011, 09:29
 
Fecha de Ingreso: enero-2011
Mensajes: 59
Antigüedad: 13 años, 3 meses
Puntos: 2
Respuesta: Box calculador
Cita:
Iniciado por laratik Ver Mensaje
Ya con el algoritmo que te di, es sencillo acondicionarlo:

Código HTML:
<html>
	<head>
		<title>Puntos de Experiencia, nivel</title>
		<script type="text/javascript">
			function convertir() {
				var num = document.getElementById("num").value;
				try {
						num = parseInt(num);
						var nivel = 1;
						for (var i=10000; i<=10485760999; i*=2) {
							if(num == nivel) {
								document.getElementById("res").value = i;
								return;
							}
							nivel++;
						}
						document.getElementById("res").value = "ERROR";
				} catch (e) {
					alert("Digite un numero valido");
				}
			}
		</script>
	</head>
	
	<body>
		<label>Nivel: </label><input type="text" id="num" /><br/><br/>
		<label>Numero: </label><input type="text" id="res" disabled="true" /><br/><br/>
		<input type="button" value="Convertir" onclick="convertir()">
	</body>
</html>
Hola,

Viendo el codigo me di cuenta que el nivel 2 debe de marcar 10.000 puntos, no 20.000, para ello cambie el codigo dejandolo asi:
Código HTML:
<title>Puntos de Experiencia, nivel</title>
		<script type="text/javascript">
			function convertir() {
				var num = document.getElementById("num").value;
				try {
						num = parseInt(num);
						var nivel = [COLOR="Red"]2[/COLOR];
						for (var i=10000; i<=10485760999; i*=2) {
							if(num == nivel) {
								document.getElementById("res").value = i;
								return;
							}
							nivel++;
						}
						document.getElementById("res").value = "ERROR";
				} catch (e) {
					alert("Digite un numero valido");
				}
			}
		</script>
	</head>
	
	<body>
		<label>Nivel: </label><input type="text" id="num" /><br/><br/>
		<label>Numero: </label><input type="text" id="res" disabled="true" /><br/><br/>
		<input type="button" value="Convertir" onclick="convertir()">

Cambiando funciona bien, el nivel 2 marca 10.000 puntos al 3, 20.000 y asi
Pero si le pongo el numero 1, el mozilla se atasca y me muestra lo siguiente:

""Un script de esta página puede estar ocupado, o puede haber dejado de responder. Puede detener el script, o puede continuar para ver si el script finaliza.""

Esdecir no asocia nada al numero 1 porque empieza por el 2.

¿Como puedo poner que al nivel 1 ponga 0?

Gracias
  #9 (permalink)  
Antiguo 11/04/2011, 10:30
Avatar de laratik  
Fecha de Ingreso: mayo-2010
Ubicación: Cali
Mensajes: 317
Antigüedad: 13 años, 10 meses
Puntos: 63
Respuesta: Box calculador
seria cuestion de validarlo solo al principio, algo como:

Código Javascript: 
Ver original
  1. function convertir() {
  2.                 var num = document.getElementById("num").value;
  3.                 try {
  4.                         num = parseInt(num);
  5.                                                  if(num == 1) {
  6.                                                      document.getElementById("res").value = 1;
  7.                                                       return;
  8.                                                   }

Es la solución más rápida... quien sabe si la mejor. SALUDOS.
__________________
Programar apasiona y lo que apasiona es un arte, por lo tanto programar es un arte.

Quiero karma para en mi próxima vida ser un billonario bien dotado con alas.
  #10 (permalink)  
Antiguo 11/04/2011, 10:43
 
Fecha de Ingreso: enero-2011
Mensajes: 59
Antigüedad: 13 años, 3 meses
Puntos: 2
Respuesta: Box calculador
Cita:
Iniciado por laratik Ver Mensaje
seria cuestion de validarlo solo al principio, algo como:

Código Javascript: 
Ver original
  1. function convertir() {
  2.                 var num = document.getElementById("num").value;
  3.                 try {
  4.                         num = parseInt(num);
  5.                                                  if(num == 1) {
  6.                                                      document.getElementById("res").value = 1;
  7.                                                       return;
  8.                                                   }

Es la solución más rápida... quien sabe si la mejor. SALUDOS.
Pensando el codigo y viendolo mas detenidamente, le intenté dar el valor "ERROR"
Código HTML:
<script type="text/javascript"> function convertir() {
var num = document.getElementById("num").value;
try {
num = parseInt(num);
var nivel = 2;
for (var i=10000; i<=10485760999; i*=2) {
if(num == nivel) {
document.getElementById("res").value = i;
return;
}
nivel++;
}
document.getElementById("res").value = "ERROR";
} catch (e) {
alert("Digite un numero valido");
}
}
</script> <label>Nivel: </label><input type="text" id="num" /><br />
<br />
<label>P.E necesarios: </label><input type="text" disabled="true" id="res" /><br />
<br />
<input type="button" onclick="convertir()" value="Calcular" /> <br />
Pero probaré a ver como tu lo dices
Un saludo!

Etiquetas: box, calculadora
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 13:42.