Al poner un divdiv
mas especificamente <div class ="izquierda" mi codigo js deja de funcionarespecíficamente <div class ="izquierda">
, solomi código js
deja de funcionar si le pongo ese div. lo
Lo que deberiadebería de hacer mi funcion jsfunción js
es que deberiadebería mandar un mensaje de correo valido o invalido al momento de apretarapretar el boton verificar correobotón verificar correo(linealínea de codigocódigo 60) pero no se porque me afecta mi div izquierda a mi codigo js, tambien revise.
También revisé el CSSCSS
y eso no afectoafecta en nada.
<body>
<h3 style="text-align: center;"><i class="loti fa-solid fa-user-pen" style="font-size: 25px;"></i> REGISTRO DE USUARIOS</h3>
<div class="tab">
<div class="izquierda">
<h4>DATOS DEL USUARIO</h4>
<form action="registro_usuarios.php" method="POST">
Título:
<select id="titulo" name="titulo" class="form-select" required>
<option value="" selected disabled hidden>Seleccione una opción</option>
<option>Lic.</option>
<option>Ing.</option>
<option>Dr.</option>
<option>Dra.</option>
<option>Sr.</option>
<option>Sra.</option>
</select>
Nombre completo:
<input id="nombre" name="nombre" type="text" class="form-control" placeholder="Ingrese nombre" required>
Fecha de nacimiento:
<input id="fecha_nacimiento" name="fecha_nacimiento" type="date" class="form-control" required>
Sexo:
<select name="sexo" id="sexo" class="form-select" required>
<option value="" selected disabled hidden>Seleccione una opción</option>
<option>Hombre</option>
<option>Mujer</option>
</select>
Teléfono:
<input id="telefono" name="telefono" type="tel" class="form-control" placeholder="2741227113" required>
</div>
<div class="vl"></div>
<div class="derecha">
<h4>USUARIO Y CONTRASEÑA</h4>
Correo:
<div class="input-group mb-3">
<input type="email" name="correo" id="correo" class="form-control" placeholder="Ingrese un correo" onblur="buscar_datos();" autocomplete="off">
<button class="btn btn-success" type="button" id="button-addon2" value="validar Correo" onclick="validarCorreo(form.correo.value)">Verificar Correo</button>
</div>
Contraseña:
<input name= "password" id="password" type="password" class="form-control" placeholder="Ingrese al menos 8 caracteres" required>
Confirmar contraseña:
<input name ="conf_password" id="conf_password" type="password" class="form-control" placeholder="Repita la contraseña" required>
Puesto de trabajo:
<select name="area_trabajo" id="area_trabajo" class="form-select" required>
<option value="" selected disabled hidden>Seleccione el área</option>
<option>Administración</option>
<option>Admisión</option>
<option>Archivo</option>
<option>Contabilidad</option>
</select>
</form>
</div>
</div>
<script src="js/script_funciones.js"></script>
<script src="js/validarco_usuario.js"></script>
</body>
function validarCorreo(correo) {
var expReg = /^[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?$/;
var esValido = expReg.test(correo);
if (esValido == true) {
alert('El correo electronico es valido');
} else {
alert('El correo no es valido');
}
}
<body>
<h3 style="text-align: center;"><i class="loti fa-solid fa-user-pen" style="font-size: 25px;"></i> REGISTRO DE USUARIOS</h3>
<div class="tab">
<div class="izquierda">
<h4>DATOS DEL USUARIO</h4>
<form action="registro_usuarios.php" method="POST">
Título:
<select id="titulo" name="titulo" class="form-select" required>
<option value="" selected disabled hidden>Seleccione una opción</option>
<option>Lic.</option>
<option>Ing.</option>
<option>Dr.</option>
<option>Dra.</option>
<option>Sr.</option>
<option>Sra.</option>
</select>
Nombre completo:
<input id="nombre" name="nombre" type="text" class="form-control" placeholder="Ingrese nombre" required> Fecha de nacimiento:
<input id="fecha_nacimiento" name="fecha_nacimiento" type="date" class="form-control" required> Sexo:
<select name="sexo" id="sexo" class="form-select" required>
<option value="" selected disabled hidden>Seleccione una opción</option>
<option>Hombre</option>
<option>Mujer</option>
</select>
Teléfono:
<input id="telefono" name="telefono" type="tel" class="form-control" placeholder="2741227113" required>
</div>
<div class="vl"></div>
<div class="derecha">
<h4>USUARIO Y CONTRASEÑA</h4>
Correo:
<div class="input-group mb-3">
<input type="email" name="correo" id="correo" class="form-control" placeholder="Ingrese un correo" onblur="buscar_datos();" autocomplete="off">
<button class="btn btn-success" type="button" id="button-addon2" value="validar Correo" onclick="validarCorreo(form.correo.value)">Verificar Correo</button>
</div>
Contraseña:
<input name="password" id="password" type="password" class="form-control" placeholder="Ingrese al menos 8 caracteres" required> Confirmar contraseña:
<input name="conf_password" id="conf_password" type="password" class="form-control" placeholder="Repita la contraseña" required> Puesto de trabajo:
<select name="area_trabajo" id="area_trabajo" class="form-select" required>
<option value="" selected disabled hidden>Seleccione el área</option>
<option>Administración</option>
<option>Admisión</option>
<option>Archivo</option>
<option>Contabilidad</option>
</select>
</form>
</div>
</div>
<script src="js/script_funciones.js"></script>
<script src="js/validarco_usuario.js"></script>
</body>
mi jsMi js
se llama validarco_usuario.jsvalidarco_usuario.js y esto es lo que contiene, es solo para que me me valide que los usuarios estenestén poniendo un correo que sea valido, este codigocódigo se usa en el <div="derecho"><div="derecho">
pero no entiendo porque al momento de que yo pongo el <div="izquierda"><div="izquierda">
de alguna manera afecta a el lado derecho haciendo que no llegue el jsjs
.
function validarCorreo(correo){
var expReg= /^[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?$/;
var esValido= expReg.test(correo);
if(esValido==true){
alert('El correo electronico es valido');
}else{
alert('El correo no es valido');
}
}