验证HTML表单并在PHP方法中使用$ _GET

时间:2016-05-21 00:27:44

标签: javascript php html

我正在尝试创建一个用户输入用户名和密码的登录信息,然后点击提交按钮运行JavaScript代码以验证是否已输入字符串。如果结果为false,则应显示alert("...")如果确实如此,则应继续提交。

然而,当我去验证提交时,它不是把它带到链接的php文件,它将我带到index.php(这不是我链接到的文件)给我一个404错误说链接是错误的或过时,我不明白我错误链接的原因或地点。

//// HTML ////

<html>
<head>

<script type="text/javascript">
   function validateThis() {
       var username = document.getElementById('username');
       var password = document.getElementById('userpass');
       if ((username.value =="") || (password.value == "")) {
        alert("Please enter your details");
        return false;
      }

   else {
      return true;
     }
}
</script>  
</head>

<body>
    <form id="myForm" name="myForm" action="loginValidate.php" 
    method="get" onSubmit="validateThis()">

    <input type="text" name="username"/>
    <input type="password" name="userpass"/>
    <input type="submit" value="Login"/>

    </form>

</body>
</html>

//// PHP ////

<?php

$username = $_GET ['username'];
echo "Hello".$username;

?>   

1 个答案:

答案 0 :(得分:2)

您要按ID(getElementById)检查元素,并且应该使用getElementsByName。 您也可以使用document.forms['myForm'].username.value == "",即:

<html>
<head>
<script type="text/javascript">
function validateThis(){
  if(document.forms['myForm'].username.value == "")
  {
    alert("empty");
    return false;
  }
    return true;
}
</script>  
</head>
<body>
    <form id="myForm" name="myForm" action="" 
    method="get" onSubmit="validateThis()">
    <input type="text" name="username"/>
    <input type="submit" value="Login"/>
    </form>
</body>
</html>
<?php
echo !empty($_GET['username']) ? "Hello ". $_GET['username'] : "";
?>  

PHPFIDDLE DEMO