Mostrar Mensajes
1
C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más / Validaciones JavaScript cadenas texto: toLowerCase charAt substring CU01142E
« en: 05 de Abril 2017, 20:40 »
Buenas tardes aquí dejo una posible solución al ejercicio CU01142E del tutorial de programación con JavaScript como si estuviera en primero.
Saludos y gracias de antemano......
Citar
EJERCICIO
Crea un documento HTML (página web) donde exista un formulario que se envíe por el método GET. Se pedirá al usuario que introduzca nombre, apellidos y correo electrónico. Define dentro de la etiqueta form que cuando se produzca el evento onsubmit (pulsación del botón de envío del formulario) se ejecute una función a la que denominaremos validar que no recibe parámetros.
La función validar debe realizar estas tareas y comprobaciones:
a) Comprobar que el nombre contiene al menos tres letras. Si no es así, debe aparecer un mensaje por pantalla indicando que el texto no cumple tener al menos tres letras. Por ejemplo si se trata de enviar Ka como nombre debe aparecer el mensaje: “El nombre no cumple tener al menos tres letras”.
b) Comprobar que el correo electrónico contiene el carácter @ (arroba) y el carácter . (punto). De no ser así, deberá aparecer un mensaje indicando que al correo electrónico le falta uno o ambos caracteres. Por ejemplo si se trata de enviar pacogmail.com deberá aparecer el mensaje: “Falta el símbolo @ en el correo electrónico”.
c) Antes de enviarse los datos del formulario a la página de destino, todas las letras del correo electrónico deben transformarse a minúsculas. Por ejemplo si se ha escrito PACO@GMAIL.COM debe enviarse paco@gmail.com
d) Antes de enviarse los datos del formulario a la página de destino, si el correo electrónico contiene la subcadena “ at “ debe reemplazarse por el símbolo @. Por ejemplo si se ha escrito paco at gmail.com debe enviarse paco@gmail.com
Código: [Seleccionar]
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Validar Formulario</title>
<style media="screen">
form {
border: solid thin rgb(126, 226, 109);
background-color: honeydew;
width: 500px;
height: 300;
}
input {
display: block;
margin-left: 25px;
}
.enviar {
border: solid thin rgb(115, 105, 201);
display: inline;
margin: 10px 10px 5px 50px;
position: relative;
top: 50px;
width: 60px;
height: 30px;
}
</style>
<script type="text/javascript">
function validar() {
var nombre = document.getElementById('nombre').value;
var email = document.getElementById('email').value;
validarNombre(nombre);
email = minusculasEmail(email);
email = atEmail(email);
validarEmail(email);
document.getElementById('email').value = email;
}
function validarNombre(nombre) {
if ((nombre.length)<3) {
alert("El nombre no cumple tener al menos tres letras");
}
}
function validarEmail(email) {
var arroba = false;
var punto = false;
for (var i = 0; i < (email.length); i++) {
if (email[i]=='@') {
arroba=true;
}
if (email[i]=='.') {
punto=true;
}
if (arroba==false || punto==false) {
alert("Su correo electronico deberia tener un \'@\' y un \'.'");
}
}
}
function minusculasEmail(correo) {
return correo.tolowerCase();
}
function atEmail(correo) {
return correo.replce(/at/g,'@');
}
</script>
</head>
<body>
<form method="get" onsubmit="validar()" name="formulario">
<label>Nombre</label>
<input type="text" name="nombre" id="nombre" placeholder="Introduzca su nombre" size="30" />
<label>Apellidos</label>
<input type="text" name="apellidos" id="apellidos" placeholder="Introduzca sus apellidos" size="60" />
<label>Correo electrónico</label>
<input type="text" name="email" id="email" placeholder="Introduzca email" size="60" />
<input class="enviar" type="submit" value="Enviar" />
<input class="enviar" type="reset" value="Reset" />
</form>
</body>
</html>
Saludos y gracias de antemano......
RSS