使用 javascript 到 php 的表单验证
Posted
技术标签:
【中文标题】使用 javascript 到 php 的表单验证【英文标题】：form validation with javascript to php 【发布时间】：2011-09-25 11:07:19 【问题描述】：我在 W3Schools 中找到了这段代码。这是关于使用 javascript 进行表单验证的。
当用户磁带错误的邮件格式时，会出现警报。
当我检查我在表单 onsubmit="return validateForm(); 上看到的代码时，函数在错误情况下返回 false。
所以我的问题是如何从 javascript 中获取布尔值以在 php 中使用它来编写错误消息而不是使用消息框。
这是我的代码：
<html>
<head>
<script type="text/javascript">
function validateForm()
var x=document.forms["myForm"]["email"].value
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
alert("Not a valid e-mail address");
return false;
</script>
</head>
<body>
<form name="myForm" action="demo_form.asp" onsubmit="return validateForm();" method="post">
Email: <input type="text" name="email">
<input type="submit" value="Submit">
</form>
</body>
</html>
提前致谢。
阿里
【问题讨论】：
W3Schools 不可靠：See W3Fools 【参考方案1】：if (..)
document.getElementByID('error').InnerHTML = "Not a valid e-mail address!";
return false;
else
document.getElementByID('error').InnerHTML = "";
并在您的标记中添加：
<span id="error"></span>
【讨论】：
【参考方案2】：我不会为此使用 PHP。
<html>
<head>
<script type="text/javascript">
function validateForm()
var x=document.forms["myForm"]["email"].value
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
document.getElementById('errorMsg').style.display = 'block';
return false;
</script>
</head>
<body>
<form name="myForm" action="demo_form.asp" onsubmit="return validateForm();" method="post">
Email: <input type="text" name="email">
<input type="submit" value="Submit">
<div id="errorMsg" style="display: none;">Not valid email</div>
</form>
</body>
</html>
这样你就不必回到你的服务器了。
【讨论】：
【参考方案3】：您无法从 javascript 中获取布尔值。您需要做的是提前准备好一个错误 div。像这样的：
<body>
<form name="myForm" action="demo_form.asp" onsubmit="return validateForm();" method="post">
Email: <input type="text" name="email">
<div id="error"></div>
<input type="submit" value="Submit">
</form>
添加 css 以隐藏它。然后在您的验证表单中，使用 javascript 更改错误 div 的 HTML。
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
document.getElementById("error").innerHTML="Not a valid e-mail address";
return false;
"return false;"部分是告诉表单不要提交。正如其他答案中提到的那样，PHP 和 Javascript 没有接口。 PHP是服务器端，Javascript是客户端。他们不互相交谈。但是，它们都可以修改 HTML。请记住，Javascript 总是在浏览器中运行。因此，如果它需要向 PHP 发送内容，您需要使用 AJAX 调用服务器端 PHP 脚本并以这种方式发送信息。然而，大多数时候，当您使用 Javascript 时，需要信息的不是 PHP，而是用户。所以使用 Javascript 来修改 HTML 就可以了。
【讨论】：
【参考方案4】：最简单的就是在函数中做显示。将警报替换为以下内容：-
document.getElementById("errormessage").innerHTML="无效 电子邮件地址”；
您的 HTML 中还需要一个带有错误消息 id 的 DIV。
【讨论】：
【参考方案5】：在使用 AJAX 之外，你不能。请记住，PHP 是一种服务器端语言，而 JavaScript 在浏览器中的客户端上运行。当 PHP 在浏览器中呈现页面时，它已经完成了处理。您需要的是两层验证——JavaScript 验证和 PHP 验证。为什么？因为可以在浏览器中关闭 JavaScript。这使得它作为一种安全措施毫无用处。 JavaScript 验证只能用作增强用户体验的一种方式。
最后，不要去 w3schools。它的很多信息都是无效的（有关更多信息，请参见网站http://www.w3fools.com）。相反，请使用 Mozilla 的开发者网络：https://developer.mozilla.org/en-US/learn/
【讨论】：
以上是关于使用 javascript 到 php 的表单验证的主要内容，如果未能解决你的问题，请参考以下文章
将变量从 PHP 传递到 javascript 并传递到 html 表单