Foros aprenderaprogramar.com
Aprender a programar => C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más => Mensaje iniciado por: Pepote21 en 09 de Junio 2017, 14:26
-
Hola a todos. Os paso mi código del ejercicio CU01155E del tutorial de fundamentos de desarrollo web con JavaScript usando Notepad++ como editor.
Gracias. Un saludo.
<!DOCTYPE html>
<html>
<head>
<title>Ejercicio aprenderaprogramar.com</title>
<meta charset="utf-8">
<style type="text/css">
body {background-color:pink; font-family: sans-serif;}
label {color: maroon; display:block; padding:5px;}
</style>
<script type="text/javascript">
var contador=0;
function validacionConExpReg(){
var nodoNombre=document.getElementById('nombre');
var nodoApellidos=document.getElementById('apellidos');
var nodoEmail=document.getElementById('email');
comprobarNombre(nodoNombre.value);
//comprobarApellidos(nodoApellidos.value);
transformarEmailAMinusculas(nodoEmail.value);
transformarAtEnEmail(nodoEmail.value);
comprobarEmail(nodoEmail.value);
//document.getElementById('email').value=email;
}
function comprobarNombre(nombre){
var regexp=/^[A-Za-z]{3,}$/;
if(!regexp.test(nombre)){
alert('Nombre no válido, vuelva a introducirlo');
}else{contador++;}
}
function comprobarApellidos(apellidos){
var regexp=/^(\w+)\s(\w+)$/;
if(!regexp.test(apellidos)){
alert('Apellidos no válidos, vuelva a introducirlos');
}else{contador++;}
}
function transformarEmailAMinusculas(email){
return email.toLowerCase();
}
function rectificarAtEnEmail(email){
return email.replace(/at/g,'@');
}
function comprobarEmail(email){
var regExp1= /[@]/;
var regExp2= /[\.]/;
if(!regExp1.test(email) || !regExp2.test(email)){
if(!regExp1.test(email) && !regExp2.test(email)){
alert('Faltan los símbolos @ y . en el correo electrónico');
}else if(!regExp1.test(email) && regExp2.test(email)){
alert('Falta el símbolo @ en el correo electrónico');
}else{
alert('Falta el símbolo . en el correo electrónico');
}
}
}
</script>
</head>
<body>
<script type="text/javascript">
</script>
<div style="width:450px;">
<form name ="formularioContacto" class="formularioTipo1" method="get" onsubmit="validacionConExpReg()">
<p>Si quieres contactar con nosotros envíanos este formulario relleno:</p>
<label for="nombre"><span>Nombre:</span> <input id="nombre" type="text" name="nombre" placeholder="Introduzca su nombre" size="60"/></label>
<label for="apellidos"><span>Apellidos:</span> <input id="apellidos" type="text" name="apellidos" placeholder="Introduzca sus apellidos" size="60"/></label>
<label for="email"><span>Correo electrónico:</span> <input id="email" type="text" name="email" placeholder="Introduzca su correo electrónico" size="60px"/></label>
<label>
<input type="submit" value="Enviar" >
<input type="reset" value="Cancelar">
</label>
</form>
</div>
</body>
</html>
-
Buenas Pepote21
En el formulario parece que no tienes definido un action, creo que sería preferible definir un action pudedes ponerle simplemente como página de destino http://aprenderaprogramar.com, de esa manera quedaría más claro si el formulario se envía o no
Si introduzco como nombre aaa, como apellidos bbb y como correo electrónico ccc no me aparece ningún mensaje, lo cual no es correcto
Deberías revisar este ejercicio
Nota: me está apareciendo el mensaje de error <<ReferenceError: transformarAtEnEmail is not defined>>
Salu2
-
Hola Ogramar.
Sí había errores en el ejercicio, especialmente el no establecer las variables en los métodos debido al return.
Adjunto el ejercicio corregido y comprobado diversas veces. Creo que para este ejercicio no se pedía la validación antes de enviar, sino solo la comprobación.
Solo decir aparte que la propiedad value en el correo electrónico la he tenido que quitar de los métodos, como se puede ver, ya que no me funcionaba para el segundo método (at) y ponerla en la iniciación y declaración del método. Supongo que todo correcto.
Gracias por todo.
Un saludo.
<!DOCTYPE html>
<html>
<head>
<title>Ejercicio aprenderaprogramar.com</title>
<meta charset="utf-8">
<style type="text/css">
body {background-color:pink; font-family: sans-serif;}
label {color: maroon; display:block; padding:5px;}
</style>
<script type="text/javascript">
var contador=0;
function validacionConExpReg(){
var nodoNombre=document.getElementById('nombre');
var nodoApellidos=document.getElementById('apellidos');
var nodoEmail=document.getElementById('email').value;
comprobarNombre(nodoNombre.value);
//comprobarApellidos(nodoApellidos.value);
nodoEmail=transformarEmailAMinusculas(nodoEmail);
nodoEmail=rectificarAtEnEmail(nodoEmail);
comprobarEmail(nodoEmail);
}
function comprobarNombre(nombre){
var regexp=/^[A-Za-z]{3,}$/;
if(!regexp.test(nombre)){
alert('Nombre no válido, vuelva a introducirlo');
}else{contador++;}
}
function comprobarApellidos(apellidos){
var regexp=/^(\w+)\s(\w+)$/;
if(!regexp.test(apellidos)){
alert('Apellidos no válidos, vuelva a introducirlos');
}else{contador++;}
}
function transformarEmailAMinusculas(email){
return email.toLowerCase();
}
function rectificarAtEnEmail(email){
return email.replace(/at/g,'@');
}
function comprobarEmail(email){
var regExp1= /[@]/;
var regExp2= /[\.]/;
if(!regExp1.test(email) || !regExp2.test(email)){
if(!regExp1.test(email) && !regExp2.test(email)){
alert('Faltan los símbolos @ y . en el correo electrónico');
}else if(!regExp1.test(email) && regExp2.test(email)){
alert('Falta el símbolo @ en el correo electrónico');
}else{
alert('Falta el símbolo . en el correo electrónico');
}
}
}
</script>
</head>
<body>
<script type="text/javascript">
</script>
<div style="width:450px;">
<form name ="formularioContacto" class="formularioTipo1" method="get" action="http://aprenderaprogramar.com" onsubmit="validacionConExpReg()">
<p>Si quieres contactar con nosotros envíanos este formulario relleno:</p>
<label for="nombre"><span>Nombre:</span> <input id="nombre" type="text" name="nombre" placeholder="Introduzca su nombre" size="60"/></label>
<label for="apellidos"><span>Apellidos:</span> <input id="apellidos" type="text" name="apellidos" placeholder="Introduzca sus apellidos" size="60"/></label>
<label for="email"><span>Correo electrónico:</span> <input id="email" type="text" name="email" placeholder="Introduzca su correo electrónico" size="60px"/></label>
<label>
<input type="submit" value="Enviar" >
<input type="reset" value="Cancelar">
</label>
</form>
</div>
</body>
</html>