在发布到服务器之前进行一些客户端验证 - 浏览器问题

Do some client side validation before posting to server - browser issue

本文关键字：客户端 验证 问题 浏览器 服务器      更新时间：2023-09-26

我有一个表格，我要发布到PHP服务器页面。在我POST之前，我在客户端做一些验证测试，如果一切正常，我返回true然后提交开始，如果有问题，我返回false，提交取消。

<form  onsubmit="return validateForm()" method="post" action="t5.php">

和验证函数：

function validateForm() {
    email = document.getElementById('email').value;
    name = document.getElementById('name').value;
    if ((name==="")|| (email=="") ) {
       document.getElementById('validateError').innerHTML="error text";

       return false;
    }
    else
  return true;
};

此逻辑适用于最新的Chrome版本，但在Chrome 19和Firefox及其返回false上尝试过此操作，但仍立即提交。有什么想法吗？

而不是在"onsubmit"上调用验证函数，您可以在单击按钮时调用类似的函数，如果没有错误，则通过代码提交表单

尝试类似的东西

<form name="testform" id="testform" method="post" action="t5.php">
    <input type="text" name="name" id="name"/>
    <input type="text" name="email" id="email"/>
    <input type="button" name="Submit" value="Submit" onclick="validateSubmitForm();"/>
</form>

validateSubmitForm 函数可能有这样的内容

function validateSubmitForm() {
   var email = document.getElementById('email').value;
   var name = document.getElementById('name').value;
   if ((name=="")|| (email=="") ) {
     document.getElementById('validateError').innerHTML="error text";
   }
   else {
     document.testform.submit();
   }
}

尝试使用 preventDefault() 来阻止表单的子结构。

如果一切正常，HTMLFormElement.submit()提交。

试试这个：

Java 脚本 

function validateForm(e) {
    email = document.getElementById('email').value;
    name = document.getElementById('name').value;
    if ((name=="")|| (email=="") ) {
       document.getElementById('validateError').innerHTML="error text";
       e.preventDefault();
    }

};

HTML

<form  onsubmit="validateForm(event)" method="post" action="t5.php">
相关文章：