Question

任何人都可以看到我的代码。我想，ajax发送我的数据两次，这就是为什么我的db重复记录

<script type="text/javascript">

    function isValidEmailAddress(email) {
        var regex = /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i;
        return regex.test(email);
    }

    function check() {
        var registration = $('input');
        registration.removeClass('error').removeClass('valid');
        var error = 0;
        registration.each(function () {
            var value = $(this).val();
            if (value.length < 4 || value === null) {
                $(this).addClass('error').animate({ opacity: 0.5}, 500);
                error++;
            } else {
                $(this).addClass('valid');
            }
        });
        if (!error) {
            if ($('#password').val() != $('#conf_password').val()) {
                $('input[type=password]').each(function () {
                    $(this).removeClass('valid').addClass('error');
                });
            }
            var email = $('input[type=email]').val();
            if (email.length < 1 || email.value == null && !isValidEmailAddress(email)) {
                $(this).addClass('error');
                error++;
            }
            else {
                $(this).addClass('valid');
            }
        }
    }

    function send_form() {
        check();
        var data = $('#registration').serialize();
        $.ajax({
                type: "POST",
                url: "{{ path('registrationAction') }}",
                data: data,
                dataType : 'json',
                success: function (data) {
                    if(data.success == true){
                        window.location.replace("{{ path('loginAction') }}");
                    }
                    else
                        alert("Error");
                    }
                }
        );
    }

    $(function () {
        $('#submit_form').click(function () {
            send_form();
        });
    });
</script>

还有一个问题，我的表格在任何情况下都会发送，但不应该。我怎么能这样做，如果有错误，表格不发送

我可能会错过什么？请帮忙

Answer 1

通过AJAX提交时，您不会阻止正常的表单提交。此外，最好将表单提交绑定到表单submit事件，而不是提交按钮click，因为表单也会在Enter按键上提交。您需要执行以下操作：

$(function () {
    $('#form-name').submit(function (event) {
        event.preventDefault();
        send_form();
    });
});

Answer 2

在表单提交事件中，返回false，否则您的表单将在您的ajax后提交。

$(function () {
    $('#submit_form').click(function () {
        send_form();
       return false;
    });
});

Answer 3

拥有全局变量

if(req_sent == 1){
return;
}
req_sent = 1;

在ajax请求之前

req_sent = 0

成功和错误回调ajax set

<form onsubmit="checkIfValid()">....

在表单提交上调用验证器方法

{{1}}

如果表单无效，则此方法应返回false。您的表单将不会被提交。

发送ajax 2次

3 个答案: