Tengo el siguiente código:
//Validar usuario existente con ajax
//Pedimos el valor del campo usuario para verificar si existe y enviarlo al controlador
//revise en la base de datos que esta palabra no exista
var usuarioExistente = false;
var emailExistente = false;
$("#usuarioRegistro").change(function(){
var usuario = $("#usuarioRegistro").val();
console.log('Usuario: ', usuario);
var datos = new FormData();
datos.append("validarUsuario", usuario);
$.ajax({
url:"views/modules/ajax.php",
method:"POST",
data: datos,
cache: false,
contentType: false,
processData: false,
success:function(respuesta){
console.log(respuesta);
if (respuesta == 0) {
$("label[for='usuarioRegistro'] span").html('<p>Este Usuario ya esxiste</p>');
usuarioExistente = true;
}else{
$("label[for='usuarioRegistro'] span").html("<p>Correcto!</p>");
usuarioExistente = false;
}
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>REGISTRO DE USUARIO</h1>
<form method="post" onsubmit="return validarRegistro()">
<label for="usuarioRegistro">Usuario<span></span></label>
<input type="text" placeholder="Maximo 10 caracteres" maxlength="10" name="usuarioRegistro" id="usuarioRegistro" required>
<label for="nombreCRegistro">Nombre Completo</label>
<input type="text" placeholder="Maximo 30 caracteres" maxlength="30" name="nombreCRegistro" id="nombreCRegistro" required>
<label for="passwordRegistro">Contraseña</label>
<input type="password" placeholder="Minimo 6 caracteres, incluir numeros y mayusculas" name="passwordRegistro" id="passwordRegistro" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,}" required>
<label for="rpasswordRegistro">Repita la Contraseña</label>
<input type="password" placeholder="Minimo 6 caracteres, incluir numeros y mayusculas" name="rpasswordRegistro" id="rpasswordRegistro" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,}" required>
<label for="emailRegistro">Correo Electrónico<span></span> </label>
<input type="email" placeholder="Escriba su correo electrónico correctamente" name="emailRegistro" id="emailRegistro" required>
<p style="text-align:center"> <a href="#"></a> Al hacer click en Enviar Acepta los terminos y condiciones</p>
<input class="btn" type="submit" value="Enviar">
</form>
Intento tomar el valor del campo input con id="usuarioRegistro" pero no lo toma.
Ya tengo la libreria, intento mostrar el valor por consola pero no funciona. Probando el código aquí en la página si lo toma es lo que no entiendo.
Utilizo Chrome.