我正在为我的网站创建一个网站，想知道在提交表单后如何打开该表单所在的模式。我在单击“提交”按钮后正在寻找打开它的位置，以便可以看到输入下的错误或显示错误已发送。我试图将javascript放入结果if或else标记中，它将无法打开模式，而只是提交表单或显示错误，但只有打开模式后才能看到它们。所以我想知道提交后如何打开备份。
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="description" content="FiveM roleplay server, with custom vehicles and scripts. Join today!">
<meta name="Keywords" content="aclfx, aclfxserver, fivem, fivem server, roleplay, gtav roleplay, gta v roleplay, fivem roleplay, fivem roleplay server, fort myers roleplay, fmrp, FMRP, fort myers rp">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="../fmrp_test/styles/animate.css" rel="stylesheet" type="text/css">
<script
src="https://code.jquery.com/jquery-3.3.1.js"
integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<link rel="stylesheet" href="https://unpkg.com/simplebar@latest/dist/simplebar.css" />
<script src="https://unpkg.com/simplebar@latest/dist/simplebar.js"></script>
<link href="https://fonts.googleapis.com/css?family=Overpass" rel="stylesheet">
<link href="../fmrp_test/styles/extra.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Quicksand" rel="stylesheet">
<title>FMRP | Applications</title>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar navbar-light bg-light">
<div class="container">
<a class="navbar-brand" href="../fmrp_test/index.html">FMRP</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse ml-auto" id="navbarNav">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="https://www.fortmyersrp.net/forum/">Forums</a>
</li>
<li class="nav-item">
<a class="nav-link" href="../fmrp_test/help.php">Help</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="../fmrp_test/applications_menu.php">Applications <span class="sr-only">(current)</span></a>
</li>
</ul>
</div>
</div>
</nav>
<br><br>
<div class="container">
<p>
<button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
Button with data-target
</button>
</p>
<div class="collapse" id="collapseExample">
<div class="card card-body">
<h1 class="title text-center" id="staff">Staff Member Application (Moderator):</h1>
<?php
if (isset($_POST["submit"])) {
$fullname = $_POST['fullname'];
$age = $_POST['age'];
$discord = $_POST['discord'];
$timezone = $_POST['timezone'];
$roleplaydescription = $_POST['roleplaydescription'];
$experence = $_POST['experence'];
$to = 'blakecharlie239@gmail.com';
$subject = 'Staff Form';
$body = "From: $fullname\n Age: $age\n Discord: $discord\n Timezone: $timezone\n How long have you roleplayed: $roleplaydescription\n Past staff experience: $experence";
// Check if name has been entered
if (!$_POST['fullname']) {
$errName = 'Please enter your full name.';
}
// Check if email has been entered and is valid
//Check if message has been entered
if (!$_POST['age']) {
$errage = 'Please enter your age.';
}
if (!$_POST['discord']) {
$errdiscord = 'Please enter your discord tag.';
}
if (!$_POST['timezone']) {
$errtimezone = 'Please enter your timezone.';
}
if (!$_POST['roleplaydescription']) {
$errroleplaydescription = 'Please enter if you have roleplayed before.';
}
if (!$_POST['experence']) {
$errexperence = 'Please enter your level of staff experience.';
}
// If there are no errors, send the email
if (!$errName && !$errage && !$errdiscord && !$errtimezone && !$errroleplaydescription && !$errexperence) {
if (mail ($to, $subject, $body)) {
$result='<div class="alert alert-success">Thank you for the application! Please allow 4-36 hours from the time of submission for a response. Please do not resubmit an application if we do not respond within that timeframe; we may have other priorities.</div>';
} else {
$result='<div class="alert alert-danger">We are sorry, but there was an error sending your message; please try again. If the error keeps occurring, please pm Spartan78942#0877 on discord for help resolving this.</div>';
} echo "<script>
$('.collapse').css('display', 'show !important');
</script>";
}
}
?>
<?php echo "<p class='text-danger'>$result</p>";?>
<div class="row">
<div class="col-md-12 col-lg-12"> <form action="applications_menu.php" method="post">
<div class="form-group">
<label for="exampleInputEmail1">First & last name:</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter your first & last name here." name="fullname">
<?php echo "<p class='text-danger'>$errName</p>";?>
</div>
<div class="form-group">
<label for="exampleInputPassword1">Age (MIN 16):</label>
<input type="number" class="form-control" id="exampleInputPassword1" placeholder="Enter your age here." name="age">
<?php echo "<p class='text-danger'>$errage</p>";?>
</div>
<div class="form-group">
<label for="exampleInputEmail1">Discord:</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter your discord tag here. Should look like this: [name]#[4 digits] Ex: aclfx#8109" name="discord">
<?php echo "<p class='text-danger'>$errdiscord</p>";?>
</div>
<div class="form-group">
<label for="exampleInputEmail1">Timezone:</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter your timezone here." name="timezone">
<?php echo "<p class='text-danger'>$errtimezone</p>";?>
</div>
<div class="form-group">
<label for="exampleInputEmail1">How long have you roleplayed?:</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter how long have you been roleplaying." name="roleplaydescription">
<?php echo "<p class='text-danger'>$errroleplaydescription</p>";?>
</div>
<div class="form-group">
<label for="exampleInputEmail1">Past staff experience:</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter and describe your past staff experience." name="experence">
<?php echo "<p class='text-danger'>$errexperence</p>";?>
</div>
<br>
<div class="row"><div class="col-lg-12"><button type="submit" name="submit" value="send" class="subbut btn btn-primary mx-auto d-block" style="width: 190px !important;height: 60px !important;font-size: 25px;">Submit</button></div></div></form>
</div>
</div></div>
</div>
</div>
</div>
</body>
</html>
答案 0 :(得分：0)
首先，由于您在导航栏中也使用了collapse，因此您的JavaScript定位了多个元素。您需要改为定位#collapseExample。
第二，您必须将show类添加到元素，而不是设置其display属性。
所以正确的js是：
$('#collapseExample').addClass('show');
您还将脚本包含在“无错误”条件下，因此它将无法运行。
如果需要，您可以在php中执行此操作。将错误检查移到表单之前，如果有任何错误，请设置一个变量。
<?php
if ($errName || $errage) // Boilerplate to set the error
$error = true;
?>
<div class="collapse<?= $error ? ' show' : '' ?>" id="collapseExample">
希望这就是您想要的，因为我在您的代码中找不到模态。
答案 1 :(得分：0)
只需在关闭body标签之前添加以下代码
它会检查表单是否已提交，以及提交的表单是否添加了一个JavaScript代码，该代码会触发折叠，从而显示您的表单响应或错误。
<?php if(isset($_POST['submit'])){
?>
<script type="text/javascript">
jQuery('#collapseExample').collapse({
toggle:true
})
</script>
<?php
}?>