Apoyo

modierlm · #1 (**permalink**) 27/05/2014, 22:00

Buen día, soy nuevo aqui, trate de buscar reglas para novicios, pero no encontre.

Les pediria su ayuda con una tarea que me pidieron en mi escuela, crear en un html un table row con 10 celdas, usando javascript generar un numero del 1 al 10 sin que se repitan.

Teniendo eso, se hara un juego, al momento en que el usuario haga click donde sea, inicia un cronometro, el juego es acomodar los numeros "desordenados" del a 1 al 10 correctamente, al momento de darle click al numero correcto en la secuencia hace "invisible" ese td, recorre la tabla y lo "aparece" mas abajo, hasta que los numeros esten ordenados correctamente y se detiene el cronometro.

Les dejo el codigo que llego hasta ahora, y si pudieran ayudar a terminar esta tarea.

Código HTML:

<!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>
<link href="css/css.css" rel="stylesheet" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Examen 3PF</title>

</head>

<body>
<table>
<tr>
<td id="c1">&nbsp;</td><td id="c2">&nbsp;</td><td id="c3">&nbsp;</td><td id="c4">&nbsp;</td><td id="c5">&nbsp;</td><td id="c6">&nbsp;</td><td id="c7">&nbsp;</td><td id="c8">&nbsp;</td><td id="c9">&nbsp;</td><td id="c10">&nbsp;</td>
</tr>
</table>
<input type="text" id="txt"><label>segundos</label>
<script type="text/javascript" src="js/random.js"></script>
<script src="js/cronometro.js"></script>
</body>
</html>

Código:

//random.js
window.onload = llenaLaTabla;



var numerosUsados = new Array(10);
function llenaLaTabla() {

	if(document.getElementById) {
		for(var i = 1; i < 11; i++) {
			fijaElValorDelCuadro(i);
		}
	} else {
		alert("Su navegador no soporta Java Script");
	}
}

var numerosUsados = new Array(10);

function fijaElValorDelCuadro(Cuadro) {
	var newNum;
	var idCuadro = "c" + Cuadro;
	
	do {
		newNum = Math.ceil(Math.random() * 10);
	} while (numerosUsados[newNum]==true);

	numerosUsados[newNum] = true;
	document.getElementById(idCuadro).innerHTML = newNum;
		
	document.getElementById(idCuadro).className = "";
	document.getElementById(idCuadro).onmousedown = cambiaElColor;
	
	
}

function cambiaElColor(evt) {
	
	var cuadroActual;
	var evento;
	var elemento;
	
	if(evt) {  
		elemento = evt.target;	//mozilla y demas
	} else {
		elemento = window.event.srcElement; //IE	
	}
	
	if(elemento.className == "") {
		elemento.className = "seleccionado";
	} else {
		elemento.className = "";
	}
}

Código:

//cronometro.js

indow.onmousedown = doTimer;

var c=0;
var t;
var timer_is_on=0;

function timedCount()
{
document.getElementById('txt').value=c;
c=c+1;
t=setTimeout("timedCount()",1000);
}

function doTimer()
{
if (!timer_is_on)
  {
  timer_is_on=1;
  timedCount();
  }
}