简体   繁体   English

使用 javascript 到 php 进行表单验证

[英]form validation with javascript to php

I find this code in W3Schools.我在 W3Schools 中找到了这段代码。 It's about form validation with Javascript.这是关于 Javascript 的表单验证。

When the user tape wrong mail format, an alert is appear.当用户磁带错误的邮件格式时,会出现警报。

When I check the code I see on form onsubmit="return validateForm(); , well the function return false in error case.当我检查我在表单onsubmit="return validateForm();上看到的代码时,function 在错误情况下返回 false。

So my question is how to get the boolean value from javascript to use it in PHP to write error message instead of use of message box.所以我的问题是如何从 javascript 中获取 boolean 值,以便在 PHP 中使用它来编写错误消息而不是使用消息框。

This is my code:这是我的代码:

<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>

Thanks in advance.提前致谢。

Ali阿里

You can't get the boolean value from javascript.您无法从 javascript 中获取 boolean 值。 What you need to do is have an error div ready in advance.您需要做的是提前准备好一个错误 div。 Something like this:像这样的东西:

<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>

Add css to it to hide it.将 css 添加到它以隐藏它。 Then in your validation form, use javascript to alter the HTML of the error div.然后在您的验证表单中,使用 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;
  }

The "return false;" “返回错误;” part is to tell the form not to submit.部分是告诉表单不要提交。 As mentioned in other answers PHP and Javascript do not interface.正如其他答案中提到的 PHP 和 Javascript 没有接口。 PHP is server side, Javascript is client side. PHP 是服务器端,Javascript 是客户端。 They don't talk to each other.他们不互相交谈。 They can, however, both modify the HTML.但是,它们都可以修改 HTML。 Just remember, Javascript always runs in the browser.请记住,Javascript 始终在浏览器中运行。 So if it needs to send things to PHP you need to use AJAX to call a server side PHP script and send the information that way.因此,如果它需要向 PHP 发送内容,则需要使用 AJAX 调用服务器端 PHP 脚本并以这种方式发送信息。 Most of the time, however, when you are using Javascript, it isn't PHP that needs the information, it's the user.然而,大多数时候,当您使用 Javascript 时,需要信息的不是 PHP,而是用户。 So using Javascript to modify the HTML does the trick.所以使用 Javascript 来修改 HTML 就可以了。

if (..)
{
   document.getElementByID('error').InnerHTML = "Not a valid e-mail address!";
   return false;
}
else
{
   document.getElementByID('error').InnerHTML = "";
}

and in your markup add:并在您的标记中添加:

<span id="error"></span>

Outside of using AJAX, you can't.除了使用 AJAX 之外,你不能。 Remember that PHP is a server side language, and that JavaScript runs on the client in the browser.请记住,PHP 是一种服务器端语言,而 JavaScript 在客户端的浏览器中运行。 By the time PHP renders the page in the browser, it's done processing.当 PHP 在浏览器中呈现页面时,它已经完成了处理。 What you need is two layers of validation - JavaScript validation AND PHP validation.您需要的是两层验证 - JavaScript 验证和 PHP 验证。 Why?为什么? Because JavaScript can be turned off in the browser.因为JavaScript可以在浏览器中关闭。 That makes it useless as a security measure.这使得它作为一种安全措施毫无用处。 JavaScript validation should only be used as a way to enhance the user's experience. JavaScript 验证只能用作增强用户体验的一种方式。

Finally, don't go to w3schools.最后,不要 go 到 w3schools。 A lot of its information is invalid (see the site http://www.w3fools.com for more info).它的许多信息是无效的(有关更多信息,请参见站点http://www.w3fools.com )。 Instead, use Mozilla's Developer Network: https://developer.mozilla.org/en-US/learn/相反,请使用 Mozilla 的开发者网络: https://developer.mozilla.org/en-US/learn/

The easiest thing is to do the display in the function.最简单的就是在function中做显示。 Replace the alert with something like:-将警报替换为以下内容:-

document.getElementById("errormessage").innerHTML="Not a valid e-mail address"; document.getElementById("errormessage").innerHTML="不是有效的电子邮件地址";

You'll also need a DIV in your HTML with an id of errormessage.您还需要在 HTML 中有一个带有错误消息 ID 的 DIV。

I wouldn't use PHP for this.我不会为此使用 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>

This way you won't have to go back to your server.这样您就不必将 go 返回到您的服务器。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM