Использовать проверки html5, даже если форма никогда не отправляется?

Question

То, что я делаю, - это захват действия щелчка на кнопке отправки формы, preventDefault() Ввод его, выполнение некоторых вычислений, а затем вызов ajax вместо отправки формы.

Есть ли способ использовать javascript, чтобы заставить валидаторы html5 срабатывать, даже если форма не отправляется?

$('#submitButton').click(function (e) { 
     e.preventDefault(); //stop the form from submitting 

     //Do computation 

     $.post('/comments', values, function(results) { 
      hideForm($('#new_comment_' + parentId)); 
      parent.children('.children').prepend(results); 
     }, 'html'); 
    }); 

Answer 1

Работает отлично, я тестировал последние Chrome и Firefox. Просто e.preventDefault() на <form>:

HTML:

<form method="post" action="test.html"> 
    <input type="text" required></input> 
    <input type="submit" value="Submit"> 
</form> 

JQ:

$('form').submit(function(e){ e.preventDefault(); }); 

пример:http://jsfiddle.net/elclanrs/2nnLc/2/

Answer 2

Использование html5 ограничений объект формы имеет несколько новых методов. Например, вы можете вызвать checkValidity() на объекте формы, чтобы проверить ввод.

<form method="post" action="test.html" id="myForm"> 
    <input type="text" required></input> 
    <input type="submit" value="Submit" id="submitButton"> 
</form> 

<script type="text/javascript"> 
    $('#submitButton').click(function (e) { 
     e.preventDefault(); 
     alert($("#myForm").get()[0].checkValidity()); 
    }) 
</script>