Jquery submit()html表单基于php脚本的返回值

时间:2011-06-27 18:49:22

标签: php jquery ajax forms

好的,如果有人可以看看这个,我真的很感激。我正在以html格式实现验证码。验证码是基于PHP的,所以我需要使用jquery将提交的表单发布到验证码检查脚本。

如果检查正确,则php脚本返回1,如果不正确,则返回0。

这一切都很有效,我遇到的问题是实际提交表单,或根据php脚本返回的内容阻止它。我的代码如下:

                <form id="contactform" action="FormHandler.cgi" method="POST">
    <input name="requiredContact" size="25" type="text" />

    <input name="requiredEmailFrom" size="25" type="text" />
    <input name="requiredTelephone" size="18" tabindex="3" />
    <textarea cols="25" name="comments" rows="4"></textarea>
    <select length="2" name="requiredContactMethod" tabindex="5">
    <option selected="" value="Email">Email</option>
    <option value="Telephone">Telephone</option>
    </select>
    <img src="captcha/captcha.php" style="float:none; margin:0px 0px -8px 0px; height:26px;"></img>
    <input type="text" id="CAPTCHA" style="margin-left: -5px; height:26px;">
            <p id="caperror"></p>
    <p><input name="B1" type="submit" value="Submit" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <input name="B2" type="reset" value="Clear" /></p>
</form> 

<script>



$('#contactform').submit(function(){
var cap = $('#CAPTCHA').val();  
cap = 'CAPTCHA=' + cap;

$.ajax({
type: 'POST',
url: 'captcha/capcheck.php',
data: cap,
dataType: "text",
error: postfail,
 success: success
});

return false;  //Temporary, to stop the form no matter what.
});

function success(result){

if(result == 1){
alert('was correct');
return true;
}
else{
alert("error" + result);
return false;
}


}

function postfail(){
alert('post failed');
    return false;
}


</script>

所以我想要发生的是,当我的成功函数返回false时,它会停止提交表单。如果返回true,请继续并提交表单。这就是我想要的

$('#contactform').submit(function(){


//The ajax post here

//check the value of the ajax success function here;

if(success(result)) {
return true;
}
else {
return false;
}
});

我不熟悉javascript中的函数范围。如果我在success函数中定义了一个变量,我就无法检查表单submit函数中的值,因为它只有一个局部作用域。我可以使用链接提交表单,然后调用submit();但我希望没有java的人可以访问该表单。

有没有办法让ajax post成功函数的结果回到submit()处理程序的范围?

4 个答案:

答案 0 :(得分:1)

我建议您在success函数中调用$('#contactform').submit(),但这只会再次调用您的事件处理程序而且您将陷入循环。

你可以做的是调用表单元素的submit函数,如下所示:

$('#contactform').submit(function(){
    var cap = $('#CAPTCHA').val();  
    cap = 'CAPTCHA=' + cap;
    myform = this; // added this line

    $.ajax({
        type: 'POST',
        url: 'captcha/capcheck.php',
        context: myform, //added this line
        data: cap,
        dataType: "text",
        error: postfail,
        success: success
    });

    return false;  //Temporary, to stop the form no matter what.
});

function success(result){
    // because we added the context option, we can now access the form with the "this" keyword
    if(result == 1){
        alert('was correct');
        // $('#contactform').submit() // this will make an infinite loop
        this.submit();  // this will submit the form
        return true;
    }else{
        alert("error" + result);
        return false;
    }
}

答案 1 :(得分:1)

除非我遗漏了某些内容,否则您应该在AJAX调用的成功函数中提交表单。在表单提交时也不应该抛出AJAX调用。在支票恢复正确之前,不应以任何方式提交表格。 IE:

$.ajax(
    //Parameters and stuff
    ).success(function() {
        //Submit the form
        $('#contactform').submit();
    }).fail(function() {
        //Onoes your call has failed. Do not submit le form :(
    });

就“范围界定”而言,这不应该是一个“范围”问题。如果您需要进一步的指导,请告诉我。

答案 2 :(得分:1)

我会写这样的函数,只在1结果上设置submitForm。

$('#contactform').submit(function(){
   var submitForm = False;
   var cap = $('#CAPTCHA').val();  
   cap = 'CAPTCHA=' + cap;

$.ajax({
   type: 'POST',
   url: 'captcha/capcheck.php',
   data: cap,
   dataType: "text",       
   success:function(result){
       if(result == 1){
          submitForm = True;
       }
   }
   });

    return submitForm;  
});

答案 3 :(得分:0)

尝试在提交按钮上进行ajax调用,而不是单击表单提交。

如果点击通话的返回为真,则调用提交功能。