更新:这个问题是由HTML中的按钮引起的,这是一个类型的提交,当它应该是类型按钮。键入进行提交,所有的变量都被设置为0推入阵列功能未登记数据到数组
我做了另外一个问题提早了如何选择一个用户注册形式的检查无线电输入的值之前重置过程。这个问题解决了,但是,它提出了一个新问题。
看来我的代码是不保存任何东西到新的用户数组,这里的代码
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Registro</title>
</head>
<body>
<form>
<label for="txtIdentificacion">Identifación</label>
<input type="text" placeholder="Número de identificación" id="txtIdentificacion" required>
<label for="txtPrimerNombre">Primer Nombre</label>
<input type="text" placeholder="Primer Nombre" id="txtPrimerNombre" required>
<label for="txtSegundoNombre">Segundo Nombre</label>
<input type="text" placeholder="Segundo Nombre" id="txtSegundoNombre">
<label for="txtPrimerApellido">Primer Apellido</label>
<input type="text" placeholder="Primer Apellido" id="txtPrimerApellido" required>
<label for="txtSegundoApellido">Segundo Apellido</label>
<input type="text" placeholder="Segundo Apellido" id="txtSegundoApellido" >
<label for="txtNacionalidad">Nacionalidad</label>
<input type="text" placeholder="Nacionalidad" id="txtNacionalidad" required>
<label for="txtTipoIdentificacion">Tipo de Identificacion</label>
<input type="text" placeholder="Tipo de Identificacion" id="txtTipoIdentificacion" required>
<label for="datFechaNacimiento">Fecha de nacimiento</label>
<input type="date" id="datFechaNacimiento" required>
<label for="">Género:</label>
<label for="rbtFemenino">Femenino</label>
<input type="radio" name="rbtGenero" value="Femenino" id="rbtFemenino" required >
<label for="rbtMasculino">Masculino</label>
<input type="radio" name="rbtGenero" value="Masculino" id="rbtMasculino" required >
<label for="rbtIndefinido">Indefinido</label>
<input type="radio" name="rbtGenero" value="Indefinido" id="rbtIndefinido" required>
<label for="numNumeroTelefonico">Número Telefonico </label>
<input type="number" placeholder="Sin guiones" id="numNumeroTelefonico" required>
<label for="txtNombreUsuario">Nombre de usuario</label>
<input type="text" placeholder="Nombre de usuario" id="txtNombreUsuario" required>
<label for="txtPassword">Contraseña</label>
<input type="password" placeholder="Contraseña" id="txtPassword" required>
<label for="rbtTipoUsuario">Soy un instructor</label>
<input type="radio" name="rbtTipoUsuario" value="Instructor" id="rbtInstructor">
<label for="rbtTipoUsuario">Soy un cliente</label>
<input type="radio" name="rbtTipoUsuario" value="Cliente" id="rbtCliente">
<label for="numEmergencia">Número de emergencia</label>
<input type="number" placeholder="Sin guiones" id="numEmergencia" required>
<button type="submit" class="btnRegistrar" id="btnRegistrar">Registrar</button>
</form>
<script src="js/logicaNegociosRegistro.js"></script>
<script src="js/logicaInterfazRegistro.js"></script>
</body>
</html>
JS
document.querySelector('#btnRegistrar').addEventListener('click', registrarNuevoUsuario);
function registrarNuevoUsuario() {
var aNuevoUsuario = [];
var sIdentificacion = '';
var sPrimerNombre = '';
var sSegundoNombre = '';
var sPrimerApellido = '';
var sSegundoApellido = '';
var sNacionalidad ='';
var sTipoIdentificacion = '';
var sFechaNacimiento = '';
var sGenero = '';
var nNumeroTelefonico = 0;
var sNombreUsuario = '';
var sPassword = '';
var nEdad = 0;
var sTipoUsuario = '';
var nEmergencia = '';
sIdentificacion = document.querySelector('#txtIdentificacion').value;
sPrimerNombre = document.querySelector('#txtPrimerNombre').value;
sSegundoNombre = document.querySelector('#txtSegundoNombre').value;
sPrimerApellido = document.querySelector('#txtPrimerApellido').value;
sSegundoApellido = document.querySelector('#txtSegundoApellido').value;
sNacionalidad = document.querySelector('#txtNacionalidad').value;
sTipoIdentificacion = document.querySelector('#txtTipoIdentificacion').value;
sFechaNacimiento = document.querySelector('#datFechaNacimiento').value;
sGenero = document.querySelector('input[name="rbtGenero"]:checked') ? document.querySelector('input[name="rbtGenero"]:checked').value : '';
nNumeroTelefonico = document.querySelector('#numNumeroTelefonico').value;
sNombreUsuario = document.querySelector('#txtNombreUsuario').value;
sPassword = document.querySelector('#txtPassword').value;
nEdad = calcularEdad();
sTipoUsuario = document.querySelector('input[name="rbtTipoUsuario"]:checked') ? document.querySelector('input[name="rbtUserTipoUsuario"]:checked').value: '';
nEmergencia = document.querySelector('#numEmergencia').value;
aNuevoUsuario.push(sIdentificacion, sPrimerNombre, sSegundoNombre, sPrimerApellido, sSegundoApellido, sNacionalidad, sTipoIdentificacion, sFechaNacimiento, sGenero, nNumeroTelefonico, sNombreUsuario, sPassword, nEdad, sTipoUsuario, nEmergencia);
console.log(aNuevoUsuario);
}
function calcularEdad() {
var fechaHoy = new Date();
var fechaNacimiento = new Date(document.querySelector("#datFechaNacimiento").value);
var edad = fechaHoy.getFullYear() - fechaNacimiento.getFullYear();
var meses = fechaHoy.getMonth() - fechaNacimiento.getMonth();
if (meses < 0 || (meses === 0 && fechaHoy.getDate() < fechaNacimiento.getDate())){
edad--;
}
}
在命中注册按钮,我得到控制台日志的结果,然而,它显示的所有字段为“”(或未定义,在nEdad变量的情况下)和长度为15
所以,因为它实际上得到正确的长度,推动自身工作,但似乎它没有得到任何更新的值。
起初,我以为这个问题可能是nEdad变量,但我通过评论禁用它,这个问题依然存在。
浏览器的控制台本身没有显示任何错误
什么回事任何想法?
似乎做工精细 - > https://jsfiddle.net/7osw5jqz/ – adeneo