AJAX提交函数优化

Question

我的网站上有一张表格。一系列函数将验证表单#contactForm上的每个表单域

我有以下提交函数，如果所有字段都有效，它会向contact-us.php发送一个ajax请求，然后显示一条成功消息。该函数可以工作，但我想知道这是否是编码的理想方式(特别是使用两(2)个return false语句)。

下面是我的部分代码：

$('#contactForm').submit(function(e){ 
    if(validateContactFirstName() && validateContactLastName() && validateContactEmail() && validateContactPhone() && validateContactMessage()) {
                e.preventDefault();
                $('#contactSubmit').button('loading');
                $('#contactSubmit').attr('disabled', 'disabled');
                $.ajax({
                            type    : 'POST',
                            url     : $(this).attr('action'),
                            data    : $(this).serialize(),
                            success : function(data) {
                                            $('.hideOnSuccess').hide();
                                            $('div.contactSuccess').html('<div class="hero-unit"><h1><i class="icon-envelope-alt successIcon"></i> Thanks!</h1><p>An email confirming the details of your message has been sent to your email address. We will respond within one business day. </p></div>');                         
                                            $('html,body').animate({
                                                    scrollTop: 0
                                            }, 800);
                            }
                });
                return false;
        } else {
                return false;
        }
});

我可以删除哪些return false语句？或者我应该把preventDefault拿出来？

Answer 1

我个人更喜欢使用$.post，它是你正在使用的东西的一种简写。

http://api.jquery.com/jQuery.post/

此外，一定要防止您的表单提交的默认值-将如下所示

$('#contactForm').submit(function(e){
    e.preventDefault();
    if(validateContactFirstName() && validateContactLastName() && validateContactEmail() && validateContactPhone() && validateContactMessage()) {
                $('#contactSubmit').button('loading');
                $('#contactSubmit').attr('disabled', 'disabled');
                $.ajax({
                            type    : 'POST',
                            url     : $(this).attr('action'),
                            data    : $(this).serialize(),
                            success : function(data) {
                                            $('.hideOnSuccess').hide();
                                            $('div.contactSuccess').html('<div class="hero-unit"><h1><i class="icon-envelope-alt successIcon"></i> Thanks!</h1><p>An email confirming the details of your message has been sent to your email address. We will respond within one business day. </p></div>');                         
                                            $('html,body').animate({
                                                    scrollTop: 0
                                            }, 800);
                            }
                });
     return false;
});

Answer 2

您可以使用jQuery Form plugin重写它，并且只提供回调。

您可以只在函数的末尾保留一个return false，并删除else。