Как предотвратить отправку формы при использовании проверки формы HTML5 на стороне клиента в Opera 11?

Question

Как предотвратить отправку формы при использовании проверки формы HTML5 на стороне клиента в Opera 11?

Вот пример тестовой страницы:

<section>
  <h2>Test</h2>
  <form>
    <input type="text" name="test" id="test" required/>
    <input type="submit" value="Test" />
  </form>
</section>

Проверка работает в Opera 11, но когда кнопка нажимается после ввода значения, браузер отправляет форму.

Я хочу, чтобы браузер осталсяна веб-странице всегда, что хорошо для сценариев только на стороне клиента, на локальном жестком диске, где нет сервера, например.

Когда я добавляю return false; или пытаюсь запретить формеотправка, проверка больше не работает.

Opera 11.10 Build 2092

РЕДАКТИРОВАТЬ:

Благодаря решению Роберта, я получил его на работу.Вот тестовая страница без jQuery.

 (function() {
   "use strict";

   window.addEventListener("load", function() {
     document.getElementById("testForm").addEventListener("submit", function(event) {
       event.target.checkValidity();
       event.preventDefault(); // Prevent form submission and contact with server
       event.stopPropagation();
     }, false);
   }, false);
 }());

<section>
  <h2>Test</h2>
  <form id="testForm">
    <input type="text" name="test" id="test" required/>
    <input type="submit" value="Test" />
  </form>
</section>

Answer 1

ОК, попробуйте .Форма в основном такая же, как и раньше:

<section>
    <h2>Test</h2>
    <form id="form">
        <input type="text" name="test" id="test" required/>
        <input type="submit" value="Test"/>
    </form>
</section>

Затем свяжите событие submit с функцией, которая вызывает метод checkValidity():

function manualValidate(ev) {
    ev.target.checkValidity();
    return false;
}
$("#form").bind("submit", manualValidate);