Bootstrap 4 PHP Login 不会隐藏警报

Question

我的PHP登录有问题。我使用bootstrap 4卡，即使我隐藏了它，警报类也总是显示。

当我提交表格时，会检查几件事：电子邮件和密码匹配吗？数据库等中是否存在电子邮件

当其中一项检查失败时，用户将不会登录，并且一个错误将存储在php:$error=1；

问题是，即使表单尚未提交，警报也始终显示，这在登录失败时很好。

这是我的带有警报的登录表

这里是我的引导4代码与php:

<div class="alert alert-danger <?php if(!isset($error)) echo 'hide';?>">
Invalid username/password! Email administrator in link below to recover it.
</div>
<div class="alert alert-warning <?php if(!isset($inactive)) echo 'hide';?>">
This account is no longer valid. Thank you!
</div>
<div style="display:none" id="login-alert" class="alert alert-danger col-sm-12"></div>

这是我的PHP登录代码：

<?php
include('connection.php');
if (isset($_POST['proceed'])) {
$username = $_POST['login'];
$password = $_POST['password'];
/***** GUIDANCE *****/
$guidance = "SELECT * FROM faculty WHERE Faculty_ID = ? AND Password = ? AND Position='Guidance' ";
$stmt = $conn->prepare($guidance);
$stmt->bind_param('is', $username, $password);
$stmt->execute();
$result = $stmt->get_result();

$student = "SELECT * FROM student WHERE Student_ID = ? AND Password = ? ";
$stmt = $conn->prepare($student);
$stmt->bind_param('is', $username, $password);
$stmt->execute();
$result2 = $stmt->get_result();
if ($result -> num_rows > 0) {
$row = $result -> fetch_object();
if($row->Status!='Active'){
$inactive = 1;
}else{
$_SESSION['access'] = 1;
$_SESSION['login'] = $row -> Faculty_ID;
$_SESSION['Faculty_Firstname'] = $row -> Faculty_Firstname;
header('Location: guidance/index.php');
}
elseif ($result2 -> num_rows > 0) {
$row = $result2 -> fetch_object();
$_SESSION['access'] = 3;
$_SESSION['Student_ID'] = $row -> Student_ID;
//$_SESSION[] = $row ->
header('Location:student/index.php ');
}else{
$error = 1;
}
}
?>

Answer 1

我认为show或hide类不适用于您设置alert和alert危险类的div。即使我只是在没有php代码的情况下手动保持"隐藏"，它也没有隐藏div元素。因此，可能还有其他方法来隐藏div。这个技巧可能适用于Bootstrap3。

尝试使用d-none而不是隐藏，您可能会得到预期的结果。

Answer 2

您的警报必须在开始时隐藏，而且它也必须是可忽略的，我建议您使用javascript，所以根据文档，您有

<div class="alert alert-warning alert-dismissible fade hide" role="alert"> <strong>Holy guacamole!</strong> You should check in on some of those fields below. <button type="button" class="close" data-dismiss="alert" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div>

我假设您使用的是bootstrap 4.1，这是文档。为了更好地理解hide/show类，请尝试使用此笔并将">hide"类更改为">show"级