Duda ejercicio javascript

Archivado
wenass ando buscando ayuda con javascript, es la ultima parte de una asignatura y de esta parte depende el aprobado, es por eso que os pido ayuda. Estoy con un ejercicio en el que me piden varios campos a rellenar y uno de ellos es numero de pasajeros mediante el cual dependiendo del numero de pasajeros se crean nuevos campos.

necesito que en funcion del numero de pasajeros de un avion me cree dos campos(nombre,dni) por cada uno de los pasajeros. lo hago de la siguiente manera este es el formulario en cuestion:

<form action="enviado.html">

Origen: <input id="origen" type="text" value="" /> <br />
Destino: <input id="destino" type="text" value="" /> <br />
Hora salida <input id="horaSalida" type="text" value="" /> <br />
Fecha: <input id="fecha" type="text" value="" /> <br />
Numero pasajeros: <input type="text" id="numpasajeros" /><input type="button" value="Crear" onclick="crear()" /> <br />
<input onclick="return validaCampos()" type="submit" value="Reservar"/>


el problema viene que no se como crear nuevos elementos la funcion crear se me ha quedado asi


function crear() {

var valor = document.getElementById("numpasajeros").value;
for(i=0; i<=numpasajeros;i++){
document.createElement();


El otro ejercicio en cuestion es mas complicado y no se ni por donde empezar, si alguien me ayuda podria incluso pagarle porque estoy desesperado

Crear una página empleando JavaScript que permita jugar el tres en raya. La representación del tablero se hará
mediante una tabla 3x3 en la que se mostrará en cada celda una imagen en blanco, o una imagen representando un círculo o una equis (haga su propia imagen basándose en la imagen en blanco del material adicional y sin variar su tamaño). Por turnos, al hacer
clic sobre una imagen en blanco, ésta se sustituirá por una equis o un círculo, según corresponda. Tras cada movimiento, la página
detectará el caso en que uno de los jugadores gane o se produzca un empate, avisando de tal circunstancia e impidiendo nuevos
movimientos.

muchas gracias
En el for imagino que el valor que quieres usar para recorrerlo es el que has obtenido con la funcion anterior, osea "valor".
Luego en vez de createElement podrías usar write (o innerHTML si tienes ya el DIV creado o el esqueleto de esos dos campos) y escribir el código directamente en html tal y como lo quieras poner(teniendo cuidado con las comillas).

De todas formas en el subforo general de PC me imagino que te podrían ayudar mejor [oki]
Crear elementos es relativamente fácil. Tienes que tener un div o un fieldset, y luego al crear los inputs le vas agregando como childs del fieldset. Los ids de los input seran "id"+i, "dni"+i, y así luego puedes diferenciarles.

Un ejemplo algo parecido aqui http://www.telefonica.net/web2/blas-mar/crear.html

El tres en raya ya es algo más complicadete, si tienes dudas determinadas podría resolvertelas, pero no voy a hacerle desde cero...

EDIT: Efectivamente, otra opción es con el innerHTML del div. Creas un string con el chorro de los inputs (en un bucle) y luego lo pegas como innerHTML del div. Como más rabia te de (o más fácil te resulte xD)
La verdad que no os he entendido bien , y el ejemplo gracias pero es algo diferente, y tampoco manejo mucho de javascript, lo que me gustaria es que al introducir el numero de clientes el form aumentase con dos campos(nombre y dni) en funcion del valor(numpasajeros) el body del codigo es el siguiente:

<body>

<h1>Compra billetes avion</h1>

<form action="enviado.html">

Origen: <input id="origen" type="text" value="" /> <br />
Destino: <input id="destino" type="text" value="" /> <br />
Hora salida <input id="horaSalida" type="text" value="" /> <br />
Fecha: <input id="fecha" type="text" value="" /> <br />
Numero pasajeros: <input id="numpasajeros" type="text" value="" /><input type="button" value="ok" onclick="crear()" /> <br />


<input onclick="return validaCampos()" type="submit" value="Reservar"/>

</form>

</body>
¿Realmente crees que es muy diferente?

function crear(){
var valor = document.getElementById("numpasajeros").value;
var FSContenedor = document.getElementById('fieldsetContenedor')
if (valor>0){
for(i=0; i<=valor;i++){
var contenedor = document.createElement('div'); // 2
contenedor.id = 'div'+i; // 3
FSContenedor.appendChild(contenedor);

var inputNombre = document.createElement('input'); // 5
inputNombre.type = 'text'; // 6
inputNombre.name = 'nombre'+i; // 6
contenedor.appendChild(inputNombre);

}

}else alert("Introduzca un numero entero positivo")
}


En dos minutos, ni lo he probado, pero no se va mucho de lo que necesitas, y lo tienescasi igual en el ejemplo que te he puesto.

Para depurar, Firebug en Firefox.

EDIT: Evidentemente, tienes que tener un fieldset creado, con id fieldsetContenedor, después del button.
he hecho lo siguiente con el innerthtml

function crear() {

var valor = document.getElementById("numpasajeros").value;
if (valor>0){
for(var i=0; i<=valor;i++){
document.getElementById('formulario').innerHTML = 'Origen: <input id="origen" type="text" value="" /> <br />';

}

}else alert("Introduzca un numero entero positivo")
}


y parte del codigo html es este <form action="enviado.html">
<div id="formulario">
Origen: <input id="origen" type="text" value="" /> <br />
Destino: <input id="destino" type="text" value="" /> <br />
¿Da algún fallo en ejecución?

EDIT: Lo siento, me tengo que ir.

EDIT2: Fijate que lo que estás haciendo es poner el mismo innerHTML una vez tras otra. Si quieres usar el innerHTML, tienes que tener una varible a modo de String a la que vayas concatenando un
Origen: <input id="origeni" type="text" value="" /> <br />
siendo "origeni" una variable formada por "origen"+i, teniendo en cuenta que i es la número de iteración. Y el innerHTML tras acabar el bucle.

Creo que me he explicado fatal pero no tengo tiempo, lo siento de verdad xD A ver si te ayuda alguien más y sino mañana si tengo 5 minutos en el curro intento ayudarte.
vale ahora me sale todo, el problema esque tenia puesta la funcion escrita dentro de otra funcion vaya despiste tonto, ahora solo me queda crear otro campo para el dni y ponerle delante el nombre aunque eso no sera dificil
Me alegro de que haya funcionado. ¡Lo que te queda ya es coser y cantar!
una ultima pregunta, tengo un ejercicio que me pide que haga un sistema de quinielas aleatorio, para el array de los resultados lo he coseguido pero para el array de los escudos de los equipos no, lo que esta en rojo es la variable que coje los escudos de los equipos de una carpeta, xro como hago para que esa j sea aleatoria y que no se repita(para no coger el mismo escudo mas veces)

for (var i=0;i<10;i++){

var res=resultados[Math.round(Math.random()*2)];
var fila=document.createElement("tr");
var clocal=document.createElement("td");
var imglocal=document.createElement("img");

imglocal.setAttribute("src", "Ej2/"+partidos[j]+".jpg");
imglocal.setAttribute("width", "80");
var cvisi=document.createElement("td");
var imgvisi=document.createElement("img");
imgvisi.setAttribute("src", "Ej2/"+partidos[j+1]+".jpg");
imgvisi.setAttribute("width", "80");
j=j+2;//para coger los dos elementos siguientes del vector
sabonis_88 escribió:una ultima pregunta, tengo un ejercicio que me pide que haga un sistema de quinielas aleatorio, para el array de los resultados lo he coseguido pero para el array de los escudos de los equipos no, lo que esta en rojo es la variable que coje los escudos de los equipos de una carpeta, xro como hago para que esa j sea aleatoria y que no se repita(para no coger el mismo escudo mas veces)

for (var i=0;i<10;i++){

var res=resultados[Math.round(Math.random()*2)];
var fila=document.createElement("tr");
var clocal=document.createElement("td");
var imglocal=document.createElement("img");

imglocal.setAttribute("src", "Ej2/"+partidos[j]+".jpg");
imglocal.setAttribute("width", "80");
var cvisi=document.createElement("td");
var imgvisi=document.createElement("img");
imgvisi.setAttribute("src", "Ej2/"+partidos[j+1]+".jpg");
imgvisi.setAttribute("width", "80");
j=j+2;//para coger los dos elementos siguientes del vector

No veo que la variable j se inicialice ahí en ningún momento
la variable j viene inicializada a 0 antes en el codigo
sabonis_88 escribió:la variable j viene inicializada a 0 antes en el codigo

Creo que planteas mal la solución...

¿Tiene alguna restricción el ejercicio?

Yo veo mejor si de inicio, tienes un array ya definido, con la ruta de las imágenes de los escudos. Luego tienes que iterar la mitad de las posiciones de ese array, coges dos elementos al azar y los eliminas del array, de forma que en la siguiente iteración ya no estarán por lo que no podrás repetir ningún escudo.

Para coger un elemento al azar, simplemente crea un número aleatorio entero entre el 0 y la longitud del array.
mira anzel este seria la funcion en cuestion

var resultados=new Array("1","x","2");
var partidos=new Array(20);
for(var i=0;i<20;i++){
partidos[i]=i+1;
}
var cuerpo=document.getElementsByTagName("body").item(0);
var tabla=document.createElement("table");
var j=0;
var visitante=document.createElement("th");
var visit=document.createTextNode("Equipo Visitante");
visitante.appendChild(visit);
var local=document.createElement("th");
var loc=document.createTextNode("Equipo Local");
local.appendChild(loc);
var resultado=document.createElement("th");
var resul=document.createTextNode("Resultado");
resultado.appendChild(resul);
tabla.appendChild(visitante);
tabla.appendChild(local);
tabla.appendChild(resultado);
for (var i=0;i<10;i++){

var res=resultados[Math.round(Math.random()*2)];
var fila=document.createElement("tr");
var clocal=document.createElement("td");
var imglocal=document.createElement("img");

imglocal.setAttribute("src", "Ej2/"+partidos[j]+".jpg");
imglocal.setAttribute("width", "80");
var cvisi=document.createElement("td");
var imgvisi=document.createElement("img");
imgvisi.setAttribute("src", "Ej2/"+partidos[j+1]+".jpg");
imgvisi.setAttribute("width", "80");
j=j+2;
var cres=document.createElement("td");
var valor3=document.createTextNode(res);
clocal.appendChild(imglocal);
cvisi.appendChild(imgvisi);
cres.appendChild(valor3);
fila.appendChild(clocal);
fila.appendChild(cvisi);
fila.appendChild(cres);
tabla.appendChild(fila);
}
tabla.setAttribute("border", "1");
cuerpo.appendChild(tabla);
}
No sé si lo he entendido bien, lo que quieres hacer y lo que te piden xD Pero creo que inicias por defecto las posiciones de los escudos de 1 a 20 en un array enumerado de 1 a 19, y luego vas obteniendo en orden los elementos, de modo que el "1 x 2" sí te sale aleatorio pero siempre juegan los mismos equipos.

Si es así, lo que deberías hacer, tal y como lo tienes montado, es crearte una función que te traiga un numero aleatorio entre 0 y 19. Además, tener un array con los números que ya has escogido. Cada vez que vayas a escoger un número aleatorio, compruebas si existe en el array de números ya escogidos. Si existe, vuelves a sacar otro número. Si no existe, lo agregas al array de números escogidos. Esto, como podrás comprender, es facilito de hacer, pero ineficiente de narices. Es mucha mejor solución la que te da Anzel. Inicializa los escudos del 1 al 20 en un array, luego vas tomando numero aleatorios entre 0 y array.length, y cada número que tomes, es un escudo que te quedas y que tienes que quitar del array de escudos.
finalmente no me dio tiempo de terminarlo pero muchas gracias a todos por la ayuda, el anterior ejercicio si que consegui realizarlo
15 respuestas
Archivado
Volver a Miscelánea