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

Question

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

我不想迷恋 javascript 验证，我只想让浏览器验证必填字段 (HTML5)。

我怎样才能实现这个目标？

Answer 1

即使您不执行 checkValidity 检查，它仍然有效。在chrome中，如果表单无效，它不会调用表单上的提交函数:

$(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
        }
    }

});