0

我正在尝试在将访问者信息添加到 mysql 数据库之前验证表单。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;
});
});

如果缺少名称，则表单会显示错误并关注要完成的字段。问题是验证码验证。如果匹配，则成功处理表单并将潜在客户添加到数据库，但是，如果在文本字段中输入的安全代码与生成的代码不匹配，则会显示错误，但表单信息仍会添加到数据库. 看起来“return false; // <= FUNCTION SHOULD EXIT HERE”无法识别。关于我的代码有什么问题的任何建议？

4

3 回答 3

1

试试这个

var phone = $("input#phone").val(); if (phone == "") { $("label#phone_error").show(); $("input#phone").focus(); 返回假；}

//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-01T14:41:16.887 回答
0

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-01T14:34:19.400 回答
0

您不能return在函数外部使用。

于 2012-10-01T14:35:54.223 回答