hola consegui el siguiente codigo html:
codigo:
Código HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Nombre</title>
</head>
<body>
<div style="position: absolute; width: 489px; height: 387px; z-index: 2; left: 6px; top: 4px" id="capa3" align="center">
<p align="center" style="margin-top: 8px; margin-bottom: 3px">CREAR PERSONAJE</p>
<form name="form1" method="post" action="ser.php">
<div style="position: absolute; width: 402px; height: 325px; z-index: 1; left: 18px; top: 40px" id="capa1" align="center">
<table cellpadding="0" cellspacing="0" height="30" width="450" id="table1">
<tr>
<td height="30" width="87">Nombre:</td>
<td height="30" width="363">
<label>
<input name="namepj" type="text" id="namepj" size="37">
</label>
</td>
</tr>
<tr>
<td height="30" width="87">Raza:</td>
<td height="30" width="363">
<label>
<select name="raza" size="1" type="text" id="raza" onChange="redirect(this.options.selectedIndex)">
<option selected>--Escoja una Raza--</option>
<option value="humano">Humano</option>
<option value="argonautas">Argonauta</option>
<option value="enano">Enano</option>
<option value="arunos">Arunos (Elfo)</option>
</select>
</label>
</td>
</tr>
<tr>
<td height="30" width="87">Profesión:</td>
<td height="30" width="363">
<label>
<select name="prof" size="1" type="text" id="prof">
<option value=" " selected> </option>
<option value=" " selected>Prof. Humanos</option>
<option value=" " selected>Prof. Argonautas</option>
<option value=" " selected>Prof. Enanos</option>
<option value=" " selected>Prof. Arunos</option>
</select>
</label>
</td>
</tr>
<tr>
<td height="30" width="87">Sexo:</td>
<td height="30" width="363">
<label>
<select name="sexo" size="1" type="text" id="sexo">
<option value="m">Masculino</option>
<option value="f">Femenino</option>
</select>
</label>
</td>
</tr>
<tr>
<td height="30" width="87">Edad:</td>
<td height="30" width="363">
<label>
<select name="edad" size="1" type="text" id="edad">
<option value="10">10 años</option>
<option value="20">20 años</option>
<option value="35">35 años</option>
<option value="45">45 años</option>
<option value="55">55 años</option>
<option value="65">65 años</option>
<option value="75">75 años</option>
<option value="85">85 años</option>
<option value="95">95 años</option>
<option value="105">105 años</option>
<option value="120">120 años</option>
</select>
</label>
</td>
</tr>
<tr>
<td height="30" width="87">Apariencia:</td>
<td height="60" width="363" rowspan="2">
<label>
<textarea name=apa type="text" ROWS=7 COLS=40 id="apa" size="41">Descrive la apariencia fisica del personaje
</textarea>
</label>
</td>
</tr>
<tr>
<td height="30" width="87"> </td>
</tr>
</table>
<p align="center">
<label>
<input type="submit" name="Submit" value="Continuar con la Creación">
<script>
var groups=document.form1.raza.options.length
var group=new Array(groups)
for (i=0; i<groups; i++)
group[i]=new Array()
group[0][0]=new Option("---Select2---"," ");
group[1][0]=new Option("Selecione una Profeción"," ");
group[1][1]=new Option("Guerrero","guerrero");
group[1][2]=new Option("Paladin(Caballero)","paladin");
group[1][3]=new Option("Mercenario(Asesino)","mercenario");
group[1][4]=new Option("Sacerdote","sacerdote");
group[1][5]=new Option("Mago","mago");
group[1][6]=new Option("Brujo","brujo");
group[2][0]=new Option("Selecione una Profeción"," ");
group[2][1]=new Option("Paladin(Caballero)","paladin");
group[2][2]=new Option("Mago","mago");
group[2][3]=new Option("Sacerdote","sacerdote");
group[3][0]=new Option("Selecione una Profeción"," ");
group[3][1]=new Option("Guerrero","guerrero");
group[3][2]=new Option("Paladin(Caballero)","paladin");
group[3][3]=new Option("Cazador","116");
group[4][0]=new Option("Selecione una Profeción"," ");
group[4][1]=new Option("Guerrero","guerrero");
group[4][2]=new Option("Paladin(Caballero)","paladin");
group[4][3]=new Option("Mago","mago");
group[4][4]=new Option("Sacerdote","sacerdotes");
var temp=document.form1.prof
function redirect(x){
for (m=temp.options.length-1;m>0;m--)
temp.options[m]=null
for (i=0;i<group[x].length;i++){
temp.options[i]=new Option(group[x][i].text,group[x][i].value)
}
temp.options[0].selected=true
}
</script>
</label>
</p>
</div>
</form>
</div>
</body>
</html> es el encargado de hacer que cuando escojas una raza te diga las profeciones de esa raza, pero yo queria que a la ves mustre en un cuadro informacion sobre esa raza y tambien sobre la profecion cuando sea selecionada, el problema es que no se como forzar a que aga las 3 cosas a la ves
en la accion de escojer la opcion de raza despliegue a la ves tanto la profeciones como la informacion en un cuadro
la idea era hacer esa informacion e en varios archivos html independientes y que al escojer una opcion cargue el archivo html en un marco