即使验证失败，表单也在提交答案

【问题标题】：Form is submitting even if validation fails即使验证失败，表单也在提交
【发布时间】：2013-12-15 16:53:19
【问题描述】：

下面是一个简单的html表单代码和javascript代码，用于在用户单击提交按钮时检查字段是否为空。

问题是，即使没有填写必要的字段，也提交了表单。如您所见，我只是一个 JS 编码的初学者，所以我不知道问题是在 if/else 语句中，还是在 JS 代码中的其他地方或表单设置不正确。

<script>
    function preveri(pov){
        var preveriime = pov.ime.value;
        var preverirojstvo = pov.rojstvo.value;
        var preverimail = pov.email.value;
        var preverikategorijo = pov.kategorija.value;

        if (preveriime == "") {
            document.getElementById('imeA').style.display="block";                                            
        }                                    
        if (preverirojstvo == "") {
            document.getElementById('datumA').style.display="block";
        }   
        if (preverimail == "") {
            document.getElementById('emailA').style.display="block";
        }   
        if (preverikategorijo == "") {
            document.getElementById('kategorijaA').style.display="block";
        }   

        if(preveriime != "" && preverirojstvo != "" && preverimail != "" && preverikategorijo != ""){                                                                              
            document.pov.submit();
        }
        else{
            return false;
        }
    }

</script>  

<h4>OBRAZEC ZA SPLETNE PRIJAVE</h4>
<br/>
<form name="pov" method="POST" action="thankUPage.php">
    <input name="ime" type="text" placeholder="Ime in Priimek"></input>
    <input name="rojstvo" type="text" placeholder="Datum rojstva"></input>
    <input name="email" type="text" placeholder="E-pošta"></input>
    <input name="kategorija" type="text" placeholder="Kategorija"></input>
    <textarea name="povprasaj" placeholder="Povprašaj"></textarea>
    <input type="submit" name="submit" id="submit" value="Pošlji!"  onclick="preveri(pov)" />
</form>
<div id="imeA" class="imeA">Obvezno polje!</div>
<div id="datumA" class="datumA">Obvezno polje!</div>
<div id="emailA" class="emailA">Obvezno polje!</div>
<div id="kategorijaA" class="kategorijaA">Obvezno polje!</div>
</div>

Tnx 提前！

【问题讨论】：

onclick="return preveri(this)" 也许？
如果在表单域中按回车会怎样？

标签： javascript html forms validation

【解决方案1】：

您在 click 事件上返回 false。您需要将您的回调函数绑定到表单的提交事件，因此返回 false 将取消表单的提交。

在表单字段中按“enter”将提交表单，并且可能不会触发提交按钮上的点击事件。

<form name="pov" method="POST" action="thankUPage.php" onsubmit="return preveri(this);" >

【讨论】：

我刚刚在此处添加了 return: 'onclick="return preveri(this)"' 并且它可以正常工作。有什么理由改用你的方法吗？
是的：尝试在关注表单输入时按“输入”。这可能不会触发某些浏览器上提交按钮上的点击事件。但它会触发表单的提交。