HTML5 форма проверки в Firefox против Chrome

Question

У меня есть простой формы контакта, который я использую форму проверки HTML5 на:

input.form-control#email(type='email', name='fromEmail', required='required', value='', placeholder='Email') 

Чтобы отправить форму, я делаю JSON после OnClick из представить кнопка. В Firefox форма проверяется правильно, предлагая пользователю заполнить пустые поля, которые они пропустили. Тем не менее, в Chrome, нажатие на кнопку отправки пропускает проверку и выдает ошибку. Есть ли что-нибудь, что я должен изменить, чтобы убедиться, что Chrome обращает внимание на проверку формы HTML5?

$('#submit').on('click', function (argument) { 
    event.preventDefault(); 
    utils.postJSON('/form', utils.getJsonFromForm("form#contact-form")).done(function (data) { 
    if (data.error) return; 
    utils.flash.success("Thanks for contacting us!"); 
    }); 
}); 

Любая обратная связь будет очень признательна.

Answer 1

Это статья, которая может помочь вашему делу: How to force a html5 form validation without submitting it via JavaScript/jQuery. Он предлагает следующий код:

var $myForm = $('#myForm'); 
if (!$myForm[0].checkValidity()) { 
    // If the form is invalid, submit it. The form won't actually submit; 
    // this will just cause the browser to display the native HTML5 error messages. 
    $myForm.find(':submit').click() 
} 

Вы можете добавить предложение else, чтобы затем выполнить свою логику выше. Надеюсь это поможет.