Question

我有一个表单，在提交时我使用e.preventDefault()阻止它，但我仍然希望浏览器在进行AJAX调用之前验证必需的字段。

我不想对javascript验证感兴趣，我只是希望浏览器验证必填字段（HTML5）。

我怎样才能做到这一点？

Answer 1

即使您不进行checkValidity检查，它仍然有效。在chrome中，如果表单无效，则不会在表单上调用submit函数：

$(document).ready(function(){
    $("#calendar_form").submit(function(e){
        e.preventDefault();
        calendarDoAjax();
    });

    function calendarDoAjax(){
        var proceed = false;
        if( $("#calendar_form")[0].checkValidity ){
            if ($("#calendar_form")[0].checkValidity()) {
                proceed = true;
            }
        }else{
            proceed = true;
        }
        if (proceed) {
            //Do ajax call
        }
    }

});

Answer 2

在提交功能的末尾添加：

if (evt && evt.preventDefault) {
    evt.preventDefault();
} else if (event) {
    event.returnValue = false;
}

return false;

并在函数中传递var evt，如下所示：

function(evt) { /* Your Code */ }

如何阻止提交但仍然验证必填字段？

2 个答案: