时间戳

首页 > 解决方案 > html 值在 php 表单中不显示为 jQuery 可见

php - html 值在 php 表单中不显示为 jQuery 可见

问题描述

刚开始使用 php 并且有点挣扎于 jQuery。浏览了文档，在我看来一切都应该正常工作，但是没有。在表单中输入错误的数据后，隐藏的值不可见。在CSS中我分配给#warning display:none

索引.php

<?php require "../src/models/Database.php"; ?>
<?php include_once "../src/controllers/DatabaseController.php"; ?>

<?php session_start(); ?>
<?php include "../src/includes/header.php"; ?>
<?php
if (isset($_POST["submit"])) {
    $username = $_POST["username"];
    $password = $_POST["password"];
    $dbController = new DatabaseController();
    $dbController->loginUser($username, $password);
}
?>
<div class="container main">
    <h1 class="text-center">Web</h1>
    <p class="text-center" id="warning">Incorrect username or password</p>
    <div class="row login-page">
        <form class="form" method="POST">
            <input class="form-control" type="text" name="username" placeholder="Username" required>
            <input class="form-control" type="password" name="password" placeholder="Password" required>
            <input class="btn btn-success" type="submit" name="submit" value="Login">
        </form>
    </div>
</div>


<?php include "../src/includes/footer.php"; ?>

头文件.php

<!DOCTYPE html>
<html lang="en">

<head>
    <!-- Bootstrap starts -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <!-- Bootstrap ends -->
    <!-- Css starts -->
    <link rel="stylesheet" href="../src/styles/css/main.css">
    <!-- Css ends -->
    <!-- Jquery starts -->
    <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
    <!-- Jquery ends -->
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title id="title"></title>
</head>

<body>

数据库控制器.php

<?php

class DatabaseController extends Database
{

    public function loginUser($username, $password)
    {
        $connection = $this->connection;
        $escapedUsername = mysqli_real_escape_string($connection, $username);
        $escapedPassword = mysqli_real_escape_string($connection, $password);

        $query = "SELECT * FROM users WHERE username = '$escapedUsername'";

        $result = $this->findUser($query, $escapedPassword);
        if ($result) {
            // $_SESSION["authenticated"] = true;
            echo "Logged in";
        } else { ?>
            <script>
                $("#warning").show();
            </script>
<?php
        }
    }
}

作曲家.json

{
    "require": {
        "components/jquery": "^3.5"
    }
}

标签： phphtmljquery

解决方案

在 html 完成之前，您将包含 jQuery 脚本。

因此，#warning页面上还没有。什么都没有显示。

您应该在之后包含您的脚本，<p class="text-center" id="warning">或者您可以告诉 jQuery 等到文档准备好后再应用show()：

$( document ).ready(function() {
    $("#warning").show();
});

推荐阅读