jQuery函數不停止執行

我想在將訪問者信息添加到mysql數據庫之前驗證表單。 jQuery腳本如下：jQuery函數不停止執行

var phone = $("input#phone").val(); 
    if (phone == "") { 
    $("label#phone_error").show(); 
    $("input#phone").focus(); 
    return false; 
} 

//Captcha validation 
var security_code = $("input#security_code").val(); 
$.ajaxSetup({cache: false}) 
$.get('getsession.php', {requested: 'seccode'}, function (data) { 
var session = data; 

if (security_code !== session) { 
    $("label#security_code_error").show(); 
    $("input#security_code").focus(); 
    alert ('NO MATCH: '+security_code+' '+session); 
    return false; // <= FUNCTION SHOULD EXIT HERE 
} else { 
    alert ('MATCH!!!: '+security_code+' '+session); 
} 
});  

    var dataString = 'name='+ name + '&email=' + email + '&phone=' + phone; 
    //alert (dataString);return false; 

    $.ajax({ 
    type: "POST", 
    url: "bin/process.php", 
    data: dataString, 
    success: function() { 
    $('#contact_form').html("<div id='message'></div>"); 
    $('#message').html("<h2>Contact Form Submitted!</h2>") 
    .append("<p>We will be in touch soon.</p>") 
    .hide() 
    .fadeIn(1500, function() { 
     $('#message').append("<img id='checkmark' src='images/check.png' />"); 
    }); 
    } 
}); 
return false; 
}); 
});

如果缺少名稱，則表單顯示錯誤並將焦點字段完成。問題是驗證碼驗證。如果匹配，表單將被成功處理，並且潛在客戶被添加到數據庫中，但是，如果在文本字段中輸入的安全代碼與生成的代碼不匹配，則會顯示錯誤，但表單信息仍會添加到數據庫。看起來像「返回false; // < =功能應該退出這裏」不被識別。任何有關我的代碼有問題的建議？

來源

2012-10-01 pbertuzzi

無關的問題，但做這樣的事情'輸入＃phone'實際上可能比單純的'＃phone'慢。 'id'查找速度非常快，不需要讓jquery驗證它也是'input'，除非真的需要檢查。 –

謝謝詹姆斯，我會根據你的建議修改代碼。 – pbertuzzi

您期望結束執行的return false位於AJAX請求的回調函數中。 AJAX中的第一個A代表異步，因此該功能在請求返回成功響應之前不會執行。

但是，由於它的是異步，所以使得該AJAX請求的其餘部分仍然會執行，因此會提交一個單獨的AJAX POST請求來提交表單數據，這與第一個AJAX調用完全無關。

你需要做的是將下面的代碼部分移動到AJAX請求的回調函數中，以檢查驗證碼，並且只有驗證成功時才執行它。

var dataString = 'name=' + name + '&email=' + email + '&phone=' + phone; 
//alert (dataString);return false; 
$.ajax({ 
    type: "POST", 
    url: "bin/process.php", 
    data: dataString, 
    success: function() { 
     $('#contact_form').html("<div id='message'></div>"); 
     $('#message').html("<h2>Contact Form Submitted!</h2>").append("<p>We will be in touch soon.</p>").hide().fadeIn(1500, function() { 
      $('#message').append("<img id='checkmark' src='images/check.png' />"); 
     }); 
    } 
});

整個代碼應該是這樣的：

var phone = $("input#phone").val(); 
if (phone == "") { 
    $("label#phone_error").show(); 
    $("input#phone").focus(); 
    return false; 
} 

//Captcha validation 
var security_code = $("input#security_code").val(); 
$.ajaxSetup({ 
    cache: false 
}) 
$.get('getsession.php', { 
    requested: 'seccode' 
}, function(data) { 
    var session = data; 

    if (security_code !== session) { 
     $("label#security_code_error").show(); 
     $("input#security_code").focus(); 
     alert('NO MATCH: ' + security_code + ' ' + session); 
     return false; // <= FUNCTION SHOULD EXIT HERE 
    } else { 
     alert('MATCH!!!: ' + security_code + ' ' + session); 
     // successful, so let's submit the details 
     var dataString = 'name=' + name + '&email=' + email + '&phone=' + phone; 
     $.ajax({ 
      type: "POST", 
      url: "bin/process.php", 
      data: dataString, 
      success: function() { 
       $('#contact_form').html("<div id='message'></div>"); 
       $('#message').html("<h2>Contact Form Submitted!</h2>").append("<p>We will be in touch soon.</p>").hide().fadeIn(1500, function() { 
        $('#message').append("<img id='checkmark' src='images/check.png' />"); 
       }); 
      } 
     }); 
    } 
});

來源

2012-10-01 14:34:19

謝謝安東尼。起初我看到你的解釋並設法理解AJAX的異步操作。然後在if語句中包含其餘的代碼。經過一段時間再次檢查這個頁面，瞧，代碼是一樣的。謝謝，我從中瞭解了很多。 – pbertuzzi

不能使用return的功能之外。。

來源

2012-10-01 14:35:54 czachor

假設最後幾行代碼是jQuery事件處理程序綁定的結束，'return'語句都顯示在有效位置。 –

czahor是正確的，但我懷疑OP已經省略了它們的功能的開始，而不是它的結束。 AJAX回調中的return語句沒有意義，返回false; // <=功能應退出 –

試試這個

VAR手機= $（「＃輸入手機」）VAL（）; （phone ==「」）{（「label＃phone_error」）。show（）; $（「input＃phone」）。focus（）; 返回false; }

//Captcha validation 
var security_code = $("input#security_code").val(); 
$.ajaxSetup({cache: false}) 
$.get('getsession.php', { requested: 'seccode' }, function(data) { 
    var session = data; 

    if (security_code !== session) { 
     $("label#security_code_error").show(); 
     $("input#security_code").focus(); 
     alert('NO MATCH: ' + security_code + ' ' + session); 
    } else { 
     alert('MATCH!!!: ' + security_code + ' ' + session); 
     var dataString = 'name='+ name + '&email=' + email + '&phone=' + phone; 
     $.ajax({ 
      type: "POST", 
      url: "bin/process.php", 
      data: dataString, 
      success: function() { 
       $('#contact_form').html("<div id='message'></div>"); 
       $('#message').html("<h2>Contact Form Submitted!</h2>") 
        .append("<p>We will be in touch soon.</p>") 
        .hide() 
        .fadeIn(1500, function() { 
         $('#message').append("<img id='checkmark' src='images/check.png' />"); 
        }); 
      } 
     }); 
    } 
});

來源

2012-10-01 14:41:16

謝謝Daniel，你的代碼工作正常。 – pbertuzzi

jQuery函數不停止執行

回答

相關問題