如果使用 jquery 验证，如何提交表单？答案

【问题标题】：How to submit form if validate using jquery?如果使用 jquery 验证，如何提交表单？
【发布时间】：2016-05-23 13:12:19
【问题描述】：

我正在使用 jquery 验证表单。因此，当表单提交时，我在验证表单后使用event.preventDefault();，表单将提交到相应的操作页面。但在我的情况下它不起作用。

编码我所做的-

$('form[name=contact_form]').submit(function(event) {
        event.preventDefault();
        var formData = $('form[name=contact_form]').serialize();
        var phone = $.trim($('form[name=contact_form]').find('input[name=PHONE]').val()).length;
        var intRegex = /[0-9 -()+]+$/;
        var alert = $('#contact_alert');
        var success = $('#contact_success');
        if(phone==0){
            phone.focus();
            alert.html("<p class='alert alert-danger' style='text-align:left;'>Phone number is required</p>");
        }
        else if((phone < 10)){
            phone.focus();
             alert.html("<p class='alert alert-danger' style='text-align:left;'>Please enter a valid phone number</p>");
             return false;
        }else{
            return true;
        }
    });

HTML 页面：

<?php
echo form_open_multipart('home/inquiry', array('name' => 'contact_form'));
?>
                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <input type="hidden" name="form_type" value="C">
                            <input type="text" name="NAME" id="user-name" class="form-control" placeholder="Full Name"/>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <input type="text" name="PHONE" id="user-phone" class="form-control" placeholder="Phone"/>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <input type="text" name="EMAIL" id="user-email" class="form-control" placeholder="Email"/>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <input type="text" name="SUBJECT" id="user-subject" class="form-control" placeholder="Reason for inquiry"/>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <textarea class="form-control" name="MESSAGE" id="user-message"  placeholder="Message"></textarea>
                    </div>
                    <div class="col-md-12 text-left">
                        <div class="form-group">
                            <input type="submit" name="submit"  class="btn btn-warning">
                        </div>
                    </div>
                </div>
                <?php echo form_close(); ?>

【问题讨论】：

标签： javascript php jquery forms validation

【解决方案1】：

如果您希望表单验证正常后提交，请不要致电event.preventDefault();。

验证失败后返回 false 就足够了。

【讨论】：

如果我不调用event.preventDefault(); 那么这个函数$('form[name=contact_form]').submit(function(event) 不会直接调用表单提交..
看起来if (phone==0) 部分也应该有return false。当电话短于 10 个字符时，您将返回 false，但当它的长度等于 0 时则不会。

【解决方案2】：

$(this).submit();

何时有效。

【讨论】：

【解决方案3】：

尝试将return true; 替换为$(this).submit();

【讨论】：

【解决方案4】：

我通常会做类似的事情

$("#submit").submit(function(e){
    if(validateFields() == true){ //If all fields are valid
        $("#submit").submit();
    }
    else{
        e.preventDefault(e);
    }    
});

【讨论】：