jQuery基於PHP腳本的返回值的submit（）HTML表單

Question

好吧，如果有人可以看看這個，我真的很感激。 我正在以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中的函數作用域不好。 如果我在成功函數中定義了一個變量，那么我將無法檢查表單提交函數中的值，因為它僅具有局部作用域。 我可以使用鏈接提交表單，然后調用Submit（）;。 但是我希望沒有Java的人可以訪問該表單。

有什么辦法可以使ajax發布成功函數的結果返回到commit（）處理程序的范圍？

Answer 1

我建議在success函數中調用$('#contactform').submit() ，但這只會再次調用事件處理程序，因此您將陷入循環。

相反，您可以做的是調用form元素的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;
    }
}

Answer 2

除非我缺少任何內容，否則您應該在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 :(
    });

就“作用域”而言，這不應該是“作用域”問題。 讓我知道您是否需要進一步的指導。

Answer 3

我會寫這樣的功能，只在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;  
});

Answer 4

嘗試在“提交”按鈕上單擊而不在表單“提交”上進行ajax調用。

如果click調用的返回為true，則調用Submit函數。