html中表单下的PHP响应答案

【问题标题】：PHP response under form in htmlhtml中表单下的PHP响应
【发布时间】：2020-12-01 19:23:54
【问题描述】：

我想在注册期间写一个通信，当用户已经存在时。使用此代码，它会将我重定向到另一个页面。我希望看到这种沟通形式。我试过这样，但它仍然将我重定向到另一个页面。我也想通过函数'response'来做，但是没有用。

register3.php

<html>
<?php                     
if (isset($_POST["register"])) {
    $connection = new mysqli("localhost", "root", "root", "users");
    $email = $connection->real_escape_string($_POST["email"]);  
    $password = sha1($connection->real_escape_string($_POST["password"])); 
    $imie = $connection->real_escape_string($_POST["imie"]);
    $nazwisko = $connection->real_escape_string($_POST["nazwisko"]);
    $data2 = $connection->query("SELECT * FROM user WHERE email='$email'");
    if($data2->num_rows >0) {
        exit('<font color="red">This user already exists</font>');
    } else 
        $data = $connection->query("INSERT INTO user 
                        (email, password, imie, nazwisko) 
                VALUES ('$email', '$password', '$imie', '$nazwisko')");
        
    if (($data === false) && ($email != "" || $password != "")) {
        echo '<script>alert("Wypełnij poprawnie pola!")</script>';
    } else {
        echo '<script>alert("Zostałeś zarejestrowany, zaloguj się.")</script>'; 
    }
               
}                    
?>

<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-16">
<link rel="stylesheet" href="style_reg.css">
<title>Strona o nalewkach - Login </title>
</head>
<body>
  <nav class="navbar">
    <div class="content">
        <div class="logo" ><a href="#">Nalewki z tradycją</a></div>
          <ul class="menu-list">
            <div class="icon cancel-btn">
              <i class="fas fa-times"></i>
            </div>
            <li><a href="#">Home</a></li>
            <li><a href="#">Przepisy na nalewki</a></li>
            <li><a href="http://localhost/projekt/login_copy.php">Logowanie</a></li>
            <li><a href="galeria.html">Galeria</a></li>
            <li><a href="#">Kontakt</a></li>
          </ul>
          <div class="icon menu-btn">
            <i class="fas fa-bars"></i>
          </div>
        </div>
      </nav>
    <div class="limiter">
        <div class="container-login100">
            <div class="wrap-login100 p-l-55 p-r-55 p-t-65 p-b-50">
                <form class="login100-form validate-form" method="POST" action="register3.php">
                    <span class="login100-form-title p-b-33">
                            Zarejestruj się do świata nalewek
                    </span>
                        
                    <div class="wrap-input100 validate-input" data-validate = "Valid email is required: ex@abc.xyz">
                        <input class="input100" type="text" name="email" placeholder="Email">
                        <span class="focus-input100-1"></span>
                        <span class="focus-input100-2"></span>
                    </div>
                        
                    <div class="wrap-input100 rs1 validate-input" data-validate="Password is required">
                        <input class="input100" type="password" name="password" placeholder="Haslo">
                            <span class="focus-input100-1"></span>
                            <span class="focus-input100-2"></span>
                        </div>
                        
                        <div class="wrap-input100 rs1 validate-input" data-validate="Password is required">
                            <input class="input100" type="text" name="imie" placeholder="Imie">
                            <span class="focus-input100-1"></span>
                            <span class="focus-input100-2"></span>
                        </div>
                        
                        <div class="wrap-input100 rs1 validate-input" data-validate="Password is required">
                            <input class="input100" type="text" name="nazwisko" placeholder="nazwisko">
                            <span class="focus-input100-1"></span>
                            <span class="focus-input100-2"></span>
                        </div>
                        <div class="container-login100-form-btn m-t-20">
                            <input type="submit" class="login100-form-btn"  value="Zarejestruj" name="register">
                            
                        </div>
                        <p id="response"></p>
                    </div>
                </form>
            </div>
        </div>
<script type="text/javascript">
    $(document).ready(function () {
        $("#login").on('click', function () {
            var email = $("#email").val();
            var password = $("#password").val();
                
            if (email == "" || password == "")
                alert('Wypelnij poprawnie formularz');
            else {
                $.ajax({
                    url: 'register3.php',
                    method: 'POST',
                    data: {
                        login: 1,
                        emailPHP: email,
                        passwordPHP: password,
                        imiePHP: imie,
                        nazwiskoPHP: nazwisko
                    },
                    success: function(response) {
                        $("#response").html(response);
                        if (response.indexOf('success') >=0)
                            alert('Wypelnij poprawnie formularz');
                        },
                        dataType: 'text'
                    }
                );
            }
    });
});
</script>
</body>
</html>

【问题讨论】：

过多的空格不会使代码可读！良好的代码缩进将帮助我们阅读代码，更重要的是，它将帮助 您调试代码 Take a quick look at a coding standard 为您自己的利益。您可能会被要求在几周/几个月内修改此代码，最后您会感谢我的。
请学习如何使用准备好的语句
警告：您的密码不安全。 php 内置密码hashing。 tutorial.
你不需要 jQuery 来完成这么简单的任务。您可以使用 Ajax 请求：blog.garstasio.com/you-dont-need-jquery/ajax

标签： php jquery forms

【解决方案1】：

你使用 jQuery 但你从不导入它，把它放在小时头部分

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

在你的 javascript 你有这个

$("#login").on('click', function () {

但我没有看到任何带有 id 登录的元素。为了防止表单提交，只需将上面的行替换为这个

$("form").on('submit', function (e) {
    e.preventDefault();

给每个表单输入一个 id，他们现在没有它们，以便能够做到这一点

var email = $("#email").val();
var password = $("#password").val();
var imie = $("#imie").val();
var nazwisko = $("#nazwisko").val();

为您的 ajax 调用准备单独的 php 文件，不能使用相同的 register3.php，因为必须执行 php 文件才能给您响应，如果不重新加载页面，您无法在 register3.php 上执行此操作。

在其他 php 文件中，例如 email-check.php，检查用户是否存在，如果不注册并返回响应 ok

$.ajax({
    url: 'email-check.php',
    method: 'POST',
    data: {
    login: 1,
    emailPHP: email,
    passwordPHP: password,
    imiePHP: imie,
    nazwiskoPHP: nazwisko
    },
    success: function(response) {
        if (response == 'ok') {
            //new user registered succesfully
            //log user in or redirect to login page
        } else {
            //user already exists
            $("#response").html('This email address is taken');
    },
});

【讨论】：