仅当我单击按钮并成功从另一个按钮发送表单时,我才想在 HTML 页面上显示弹出消息。我尝试使用 PHP 会话(当然包括 JavaScript)来做到这一点,我看到一切都正常,但是弹出窗口所在的页面,当我直接访问它时也会显示弹出窗口,而不是从表单提交的页面。我只想在我从表单页面成功发送表单时显示它。
这是表单提交页面代码(form.php):
<?php
session_start();
if ($_SERVER["REQUEST_METHOD"] == "POST") {
//database
if ($stmt->execute()) {
$_SESSION['successMessage'] = "Correctly saved";
$_SESSION['fromForm'] = true;
header('Location: secondpage.php');
exit;
}
}
?>
<form method="POST">
<input type="text" name="field1" required>
<button type="submit">Submit</button>
</form>
这是弹出消息的页面代码(second.php)
<?php
session_start();
?>
<body>
<div id="popupMessage" class="popup-message">
<span class="popup-icon">!</span>
<span class="popup-text" id="popupText"></span>
</div>
<?php
if (isset($_SESSION['fromFORM']) && $_SESSION['fromFORM'] === true) {
if (isset($_SESSION['successMessage'])) {
echo '<script type="text/javascript">',
'showPopupMessage("' . $_SESSION['successMessage'] . '");',
'</script>';
unset($_SESSION['successMessage']);
}
unset($_SESSION['fromFORM']);
}
?>
<script src="script.js"></script>
还有 JavaScript 文件 (script.js):
function showPopupMessage(message) {
const popup = document.getElementById('popupMessage');
const popupText = document.getElementById('popupText');
popupText.textContent = message;
popup.classList.add('show');
setTimeout(() => {
popup.classList.remove('show');
}, 3000); // The message will disappear after 3 seconds
}
在尝试调用它定义的函数之前,您必须加载
script.js
。因此,在脚本中向上移动 <script src="script.js"></script>
。
<?php
session_start();
?>
<body>
<div id="popupMessage" class="popup-message">
<span class="popup-icon">!</span>
<span class="popup-text" id="popupText"></span>
</div>
<script src="script.js"></script>
<?php
if (isset($_SESSION['fromFORM']) && $_SESSION['fromFORM'] === true) {
if (isset($_SESSION['successMessage'])) {
echo '<script type="text/javascript">',
'showPopupMessage("' . $_SESSION['successMessage'] . '");',
'</script>';
unset($_SESSION['successMessage']);
}
unset($_SESSION['fromFORM']);
}
?>