Cita:
Iniciado por Alexis88 
Amigo me Parecio muy buena tu explicacion, soy nuevo en este tema pero mira creo que soy un poco torpe y no se yo coloque todo el codigo en este forma
index.php
Código PHP:
<html>
<head>
<title></title>
</head>
<style type="text/css">
.valid{
background: green;
}
.invalid{
background: red;
}
.valid, .invalid{
color: white;
}
</style>
<body>
<form id = "datos" action = "registrar.php" method = "post">
<label for = "correo">Ingrese su correo electrónico para suscribirse a nuestras noticias:</label>
<input type = "email" name = "correo" id = "correo" required />
<span id = "mensaje"></span>
<input type = "submit" value = "Suscribirse" />
</form>
<?php
$conexion = mysqli_connect("localhost", "root","dbjeison");
if (!$conexion) exit(mysqli_connect_error());
$correo = mysqli_real_escape_string($conexion, strip_tags(trim($_POST['correo'])));
$consulta = "SELECT correo FROM usuarios WHERE correo = '$correo'";
$resultados = mysqli_query($conexion, $consulta) or exit(mysqli_error());
echo mysqli_num_rows($resultados) ? 'yes' : 'no';
?>
<script>
var form = document.querySelector("#datos"),
input = document.querySelector("#correo"),
span = document.querySelector("#mensaje"),
ajax, envio;
input.addEventListener("blur", function(){
ajax = new XMLHttpRequest();
ajax.open("GET", "comprobar.php?correo=" + this.value, true);
ajax.send();
ajax.addEventListener("load", function(){
if (this.status == 200){
if (this.responseText == "yes"){
span.innerHTML = "El correo electrónico ingresado ya está registrado. Ingrese otro.";
span.className = "invalid";
envio = false;
}
else{
span.innerHTML = "Continúe con el ingreso de datos.";
span.className = "valid";
envio = true;
}
}
}, false);
}, false);
form.addEventListener("submit", function(event){
event.preventDefault();
if (envio){
this.submit();
}
else{
alert("Debe de ingresar otro correo electrónico");
input.value = "";
input.focus();
}
}, false);
</script>
<script>
document.addEventListener("DOMContentLoaded", function(){
/* Aquí va el código */
}, false);
</script>
</body>
</html>
o tengo que separar todo amigo?