0

我在表单中使用 jcaptcha 进行图像验证。在提交表单之前，我使用 javascript 进行 ajax 调用，以验证用户输入的与显示的图像相对应的文本。我得到结果并更新文本框（imageVerification）的值。在执行这个 ajax 调用的函数之后，我从这个刚刚更新的文本框（imageVerification）中获取结果的值。

这是问题所在：我无法从此文本框（imageVerification）中获取值。它总是显示为空白。

抓住：如果我在获取值之前使用 alert()，我能够正确地获取值。我在 firebug 调试模式下运行它，发现即使不使用警报它也可以在调试模式下工作。

似乎在更新文本框（imageVerification）中的值之前存在延迟。所以我引入了一个 setTimeout() 方法并且能够获取值。

但我觉得这不是正确的解决方案。我假设javascript按顺序执行。那么，为什么我的声明在通过无法立即获取它的方法更新后获取值。结果是即使图像验证成功，我的检查也失败了，因为它无法从文本框中获取结果值。

此外，如果我使用一个简单的函数来更新文本框（imageVerification）而不是 ajax 调用，我不会遇到这个问题。

这是我用于 ajax 调用的代码。

函数 fetchContainerContent(url, containerid) {

var imageValue = document.forms['ratingForm'].elements['jcaptcha'].value;


    var req = false;
    var parameterString;

    if (window.ActiveXObject) {
        try {
            req = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                req = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {}
        }
    } else if (window.XMLHttpRequest) {
        req = new XMLHttpRequest();
    } else {
        return false;
    }

    req.onreadystatechange = function() {
        requestContainerContent(req, containerid);
    }

    parameterString = "jcaptcha="+imageValue;
    req.open('POST', url, true);
    req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

    req.send(parameterString);

}

function requestContainerContent(req, containerid) {
    if (req.readyState == 4 && (req.status==200 || window.location.href.indexOf("http")==-1)){

    //document.getElementById(containerid).innerHTML = req.responseText
    //document.getElementById(containerid).value=req.responseText;
    document.forms['ratingForm'].elements[containerid].value = req.responseText;
    }




}

这是图像验证的功能：

函数验证图像（）{

if(isBlank(document.forms['ratingForm'].elements['jcaptcha'].value)){
    showError('',"Please enter the text seen in the image above",'jcaptchaError');
    return false;
}
 fetchContainerContent('captchaController','imageVerification');


 var obj = document.forms['ratingForm'].elements['imageVerification'];
//alert('val '+obj.value);
var vall = obj.value;
if(vall=='PASS'){
    return true;

}
else{
    showError('',"Image verification failed. Please refresh image and try again","jcaptchaError");
    return false;
}

}

发布我对 fetchContainerContent('captchaController','imageVerification') 的调用，应该设置 imageVerification 文本框的值。如果我使用在 fetchContainerContent('captchaController','imageVerification') 调用之后注释的警报框，它可以正常工作。

请帮帮我。非常感谢

4

1 回答 1

0

更新的答案：第一次通过时误读程序流程。

基本问题是当 XMLHttpRequest 需要时间来完成时，您正试图从validateImage()函数（return真或假）获得即时响应。

将基于 的操作移动return到它们自己的函数 ( validFunction, invalidFunction) 并尝试以下操作：

function validateImage() {}
  if(isBlank(document.forms['ratingForm'].elements['jcaptcha'].value)){
      showError('',"Please enter the text seen in the image above",'jcaptchaError');
      return false;
  }

  var obj = document.forms['ratingForm'].elements['imageVerification'];

  validReq = fetchContainerContent('captchaController','imageVerification');
  validReq.onload = function () {
    var validResp = this.reponseText;
    if(validResp=='PASS'){
        validFunction();
    }
    else{
        showError('',"Image verification failed. Please refresh image and try again","jcaptchaError");
        invalidFunction();
    }
  }

  validReq.send(parameterString);
}

function fetchContainerContent(url, containerid) {
var imageValue = document.forms['ratingForm'].elements['jcaptcha'].value;
    var req = false;
    var parameterString;

    if (window.ActiveXObject) {
        try {
            req = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                req = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {}
        }
    } else if (window.XMLHttpRequest) {
        req = new XMLHttpRequest();
    } else {
        return false;
    }

    parameterString = "jcaptcha="+imageValue;
    req.open('POST', url, true);
    req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

    return req;
}
于 2012-06-07T14:57:02.073 回答