Ayuda con Formulario Javascript

Citar

Escrito el 17 Feb 2012 05:30 am

Bueno estoy aprendiendo javascript entonces estoy creando un formulario que me presente los registros en pantalla pero cuando le doy a enviar aperece la tabla y luego desaparece en segundos

.

aqui dejo el codigo para que lo prueben lo que digo

Este es el codigo HTML

Código HTML :

<html>
<head>
<title>Registro de Usuario</title>
<link rel="stylesheet" type="text/css" href="estilos/css.css" />
<script type="text/javascript" src="script/script.js">
</script>
</head>
<body>



  <h1>Registro de Usuario</h1>
   <form>
      <table>
         <tr>
            <td>Nombre:</td>
            <td><input type="text" id="txtNombre" value="aaa"/></td>
         </tr>
         
         <tr>
            <td>Apellido:</td>
            <td><input type="text" id="txtApellido"/></td>
         </tr>
         <tr>
            <td>Telefono:</td>
            <td><input type="text" id="txtTelefono"/></td>
         </tr>
         
         <tr>
            <td>Email:</td>
            <td><input type="text" id="txtEmail"/></td>
         </tr>
         
         <tr>
            <td>Sexo:</td>
            <td>Hombre<input type="radio" id="rad" name="rad" value="Hombre" />
            Mujer<input type="radio" id="rad" name="rad" value="Mujer" /></td>
         </tr>
         
         <tr>
            <td>Comentario:</td>
            <td><textarea id="txtComentarios"></textarea></td>
         </tr>
         
         <tr>
            <td colspan="2" align="center"><input type="submit" id="envia" value="Guardar"  onclick="registro()"/></td>
         </tr>
        </table>

</div>

   <div id="registrado">
   
   
   </div>
</body>
</html>

Este es el codigo Javascript

Código Javascript :


function registro(){
   crearTabla();
nombre = document.getElementById("txtNombre").value;
apellido = document.getElementById("txtApellido").value;
telefono = document.getElementById("txtTelefono").value;
email = document.getElementById("txtEmail").value;
sexo = document.getElementsByName("rad").value;
coment = document.getElementById("txtComentarios").value;

 tabla = [nombre,apellido,telefono,email,sexo,coment];
      tr2 = document.createElement("tr");
       table.appendChild(tr2);      
      var i=0
      while(i !=6){
      i++
       td = document.createElement("td");
        td.innerHTML = tabla[i]
        td.style.border = "solid 2px black"
       tr2.appendChild(td)
        
      
      }

}


function crearTabla(){
  table = document.createElement("table");
  table.id = "tablaResgistro"
  table.style.border = "solid 2px black"
  
  encabezado = ["Nombre", "Apellido", "Telefono", "Email", "Sexo", "Comentarios"];
  
   tr = document.createElement("tr");
   table.appendChild(tr);
     for(var i=0; i!=6; i++){
        th = document.createElement("th")
         txt = document.createTextNode(encabezado[i]);
        th.appendChild(txt);
         tr.appendChild(th);  
        th.style.border = "solid 2px red";
    }
 

  div = document.getElementById("registrado");
  div.appendChild(table);
 }

Agradeceria que me ayudaran a resolver este problema