如何在Opera 11中使用HTML5客戶端表單驗證時阻止表單提交？

Question

如何在Opera 11中使用HTML5客戶端表單驗證時阻止表單提交？

這是一個示例測試頁面：

 <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

編輯：

感謝robertc的解決方案，我得到了它的工作。 這是沒有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);