Necesita un retraso en una función jQuery

Question

Necesito poner un retraso de un segundo en esta función jQuery para que cuando el captcha se complete correctamente, haya un retraso suficiente (un segundo, creo) para que se muestre el #captchaStatus antes del siguiente paso del proceso (que es un html que se publica).

Debe ser bastante fácil, aunque estoy aprendiendo jQuery ... ¿Ideas? Gracias.

function validateCaptcha()
{
    challengeField = $("input#recaptcha_challenge_field").val();
    responseField = $("input#recaptcha_response_field").val();
    //alert(challengeField);
    //alert(responseField);
    //return false;
    var html = $.ajax({
    type: "POST",
    url: "/wp-content/themes/default/ajax.recaptcha.php",
    data: "recaptcha_challenge_field=" + challengeField + "&recaptcha_response_field=" + responseField,
    async: false
    }).responseText;

    if(html == "success")
    {
        $("#captchaStatus").html("You got it right - I'm sending the email now....");
        return true;
    }
    else
    {
        $("#captchaStatus").html("Your captcha is incorrect - please try again...");
        Recaptcha.reload();
        return false;
    }
}

Answer 1

Debería estar utilizando una devolución de llamada. echa un vistazo a este elemento de preguntas frecuentes de jQuery sobre esto.

  

El código no funciona como se desea debido a la naturaleza de la programación asincrónica. El controlador de éxito proporcionado no se invoca de inmediato, sino en algún momento en el futuro cuando se recibe la respuesta del servidor. Entonces, cuando usamos la variable 'estado' inmediatamente después de la llamada $ .ajax, su valor aún no está definido.

 getUrlStatus('getStatus.php', function(status) {
    alert(status);
 });


function getUrlStatus(url, callback) {
  $.ajax({
     url: url,
     complete: function(xhr) {
         callback(xhr.status);
     }
  });
}

Answer 2

Puede fingir el retraso animando alguna propiedad benigna como la opacidad de 1 a 1 durante 1 segundo y al completar la devolución de llamada envíe su formulario ...

$("#captchaStatus")
    .html("You got it right - I'm sending the email now....")
    .animate({opacity: 1.0}, 1000, "linear", function() {
        submitMyForm();
    });

Answer 3

El secreto es la función setTimeout no jQuery JS. Esto realizará su operación 1 segundo después:

setTimeout(function() {
  $("#captchaStatus").html("You got it right - I'm sending the email now....");
}, 1000);