Question

我在通过javascript运行验证后，无法保留已在网页上设置的HTML表单数据。我已经尝试将数据设置为验证失败期间验证之前的数据，但表单实际上并未更新，直到完成此操作为止。我相信这是因为当验证失败时，我设置了theForm.action = "this_page.html"。这会将页面刷新为原始状态（我认为）。

这是我的形式的要点：

<!--this_page.html-->
<form name="article" onsubmit="return submitArticle(this);" method="get">
    <select id="category" onchange="subCategory()">
        <option value="DEFAULT">Please Choose Category</option>
        <option value="Pick Me!">Pick Me!</option>
    <input type="submit" value="Submit"/>
</form>

验证的要点：

function submitArticle(theForm) {
    var cat = document.getElementById('category').selectedIndex;
    if (!cat){
        alert("Please fill out categories!");
        theForm.action = "this_page.html";
}

Answer 1

为什么不在表单无效时阻止表单提交？

而不是theForm.action = "this_page.html";只需return false;。

Answer 2

使用html 5内置验证代替java脚本，您可以轻松管理或确保您的验证功能在文档之外。如果您坚持使用当前的验证方法，请准备好

如何在JavaScript中验证失败后保留表单数据

2 个答案: