Question

我已经创建了一个登录页面。单击提交按钮后，我无法将其与下一页链接。我想验证并重定向到下一页。我home.php.Kindly帮我找出我是什么丢失。

signin.php

<!DOCTYPE html>
    <html>

    <head>
<script>
function val()
{
var a=document.signin.user.value;
var b=document.signin.password.value;
if ( a == "admin" && b == "rec"){
alert ("Login success");
window.location = "home.php"; 
return false;
}
else{
alert("login failed")
}
}
</script>   
    <meta charset="UTF-8">

    <title>LIBRARY </title>

    </head>

    <body>

    <div class="body"></div>
    <div class="grad"></div>
    <div class="header">
    <div>REC<span>LIBRARY</span></div>
    </div>
    <br>
<br>
<br>
    <div class="login">
<form name="signin" method="post" onsubmit="val();">
    <input type="text" placeholder="username" name="user"><br>
    <input type="password" placeholder="password" name="password"><br>

<input type="submit" id="mybutton" value="login"></form>
    </div>



    </body>

    </html>

Answer 1

问题是onsubmit事件没有返回false，因此它会在JavaScript完成后正常发布表单。即使在成功登录并执行重定向的情况下，表单仍将提交，它将覆盖重定向。

首先，将你的return false;移到函数的末尾，以便它始终执行。

其次，将onsubmit="val();"更改为onsubmit="return val();"。这意味着onsubmit事件将始终返回false，并且不会尝试发布表单。

旁注：这绝不是一个安全的系统。任何访问者都可以简单地观察HTML源代码来查找密码，或者直接导航到home.php。对于安全系统，您需要在服务器端进行身份验证（在PHP中）。

Answer 2

您可以使用preventDefault（）事件方法而不使用onsubmit = val（），如下所示。

document.getElementById("signin").addEventListener("submit", function(e){
    e.preventDefault()
// actual code to validate
});

或

可以直接在服务器端尝试一些脏工作来隐藏验证部分

<?php
ob_start();
session_start();
loginForm();
$userinfo = array(
                'admin'=>'0b2c082c00e002a2f571cbe340644239'
                );
if(isset($_POST['username'])){
    if($userinfo[$_POST['username']] == md5($_POST['password'])){
         $_SESSION['username'] = $_POST['username'];
         header('Location: home.php');
         exit();
    }else{
         ?>
        <script type="text/javascript"> 
                alert("Oops.... User name or Pasword is worng, Please try again");
        </script>
        <?php
    }
}
function loginForm()
{
?>
        <form name="login" action="" method="post">
            Username:  <input type="text" name="username"> <br><br>
            Password:  <input type="password" name="password"><br>
                        <input type="submit" value="login">
        </form>
<?php
}
?>

验证并链接到另一个页面

2 个答案: