php - 如何在 PHP 中使用表单按钮销毁/重置会话
问题描述
我正在尝试销毁/重置我的会话,以便它清理我在我按下表单中的重置按钮时创建的日志div。我已经从一个清除整个页面的 .js 文件中为我的按钮 ( btnReset ) 分配了一个方法。现在我只想让它清除存储我所有计算的Logs div。我不知道该怎么做。
任何帮助将不胜感激。SESSIONS 对我来说仍然很新,所以我正在尽力理解它。如果有人可以向我解释如何在按下重置按钮以销毁/重置我的会话后正确清除日志div,那将非常感激!
索引.php
<?php
session_start();
if (!isset($_SESSION['results'])) {
$_SESSION["results"] = [];
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Meta Tags -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Calculator++ with PHP">
<!-- Title -->
<title>Calculator ++ | Calculator</title>
<!-- Favicon -->
<link rel="icon" type="image/png" sizes="16x16" href="Images/favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="Images/favicon-32x32.png">
<!-- Stylesheets -->
<link rel="stylesheet" type="text/css" href="CSS/Style.css">
<!-- PHP Files -->
<?php include 'PHP/Calculation.php';?>
</head>
<body>
<!-- Selection for Calculator & Converter -->
<div class="selection">
<div class="titleSelect">Options</div>
<a class="btn-selection" href="Index.php">Calculator</a>
<a class="btn-selection" href="Converter.php">Converter</a>
</div>
<!-- Calculator Container -->
<div class="container">
<div class="result">
<!-- Prints the result -->
<div class="result"><?php echo $Result; ?></div>
</div>
<div class="calculator">
<form action="Index.php" method="POST">
<ul>
<!-- First number -->
<li>
<label for="numberOne"><strong>Number one:</strong></label>
<input class="inputNumbers" type="number" name="numberOne" placeholder="Enter a number">
</li>
<!-- Operation -->
<li>
<label for="operation"><strong>Operation:</strong></label>
<select class="inputNumbers" name="operation" id="operator-list">
<option value="+">+</option>
<option value="-">-</option>
<option value="x">x</option>
<option value="/">/</option>
<option value="sqrt">^</option>
<option value="pow">√</option>
</select>
</li>
<!-- Second number -->
<li id="second-input">
<label for="numberTwo"><strong>Number two:</strong></label>
<input class="inputNumbers" type="number" name="numberTwo" placeholder="Enter a number">
</li>
<!-- Decimal Slider -->
<li>
<label><strong>Decimal: </strong><span id="value_slider"></span></label>
<input type="range" name="slidebar" min="0" max="10" value="0" id="slider" class="slider_style input">
</li>
<!-- Calculate & Reset button -->
<li>
<input class="btn-calculate" type="submit" name="btnCalculate" value="Calculate">
<button class="btn-reset" type="reset" name="resetForm" onclick="btnReset();" value="resetButton">Reset</button>
</li>
</ul>
</form>
</div>
<!-- Logs -->
<div class="logs-container">
<div class="logs-title">Logs</div>
<div class="logs">
<?php echo implode("<br>",$_SESSION["results"]); ?>
</div>
</div>
</div>
<!-- JavaScript -->
<script type="text/javascript" src="JS/HideSecondInput.js"></script>
<script type="text/javascript" src="JS/Slider.js"></script>
<script type="text/javascript" src="JS/Reset.js"></script>
</body>
</html>
计算.php
<?php
$Result = 0;
if (isset ($_POST['btnCalculate']) ) {
$numberOne = $_POST['numberOne'];
$operation = $_POST['operation'];
$numberTwo = $_POST['numberTwo'];
if ($operation == '+') {
$Result = ((int)$numberOne + (int)$numberTwo);
$_SESSION["results"][]="$numberOne + $numberTwo = $Result";
}
else if ($operation == '-') {
$Result = ((int)$numberOne - (int)$numberTwo);
$_SESSION["results"][]="$numberOne - $numberTwo = $Result";
}
else if ($operation == 'x') {
$Result = ((int)$numberOne * (int)$numberTwo);
$_SESSION["results"][]="$numberOne * $numberTwo = $Result";
}
else if ($operation == '/') {
if ($numberOne and $numberTwo > 0)
{
$Result = $numberOne / $numberTwo;
$_SESSION["results"][]="$numberOne / $numberTwo = $Result";
} else {
echo "<script>alert('Cannot divide by 0');</script>";
}
}
else if ($operation == 'sqrt') {
$Result = sqrt($numberOne);
$_SESSION["results"][]="sqrt($numberOne) = $Result";
}
else if ($operation == 'pow') {
if ($numberOne and $numberTwo > 0)
{
$Result = pow($numberOne, $numberTwo);
$_SESSION["results"][]="pow($numberOne, $numberTwo) = $Result";
} else {
echo "<script>alert('Please enter a number in both fields');</script>";
}
}
else $Result = 'Unknown';
}
?>
重置.js
//Resets the entire page when reset button is pressed
function btnReset() {
const xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET", false);
xmlhttp.send();
window.parent.location = window.parent.location.href;
}
解决方案
你基本上需要通过以下方式调整你的代码:
btnReset 应该发送特定的标志来销毁会话
btnReset 应该等待请求完成,然后进行重定向。
在 PHP 上,您应该检查标志,如果找到,则删除会话。
function btnReset(event) { const xmlhttp = new XMLHttpRequest(); xmlhttp.open("POST", '/index.php?reset=true', true); xmlhttp.onreadystatechange = function() { // Call a function when the state changes. if (this.readyState === XMLHttpRequest.DONE && this.status === 200) { window.parent.location = window.parent.location.href; } } xmlhttp.send(); }
并在 PHP (calculations.php) 中:
if(@$_GET['reset'] == true) {
$_SESSION["results"] = [];
session_destroy();
}
当然,这是一种简单的方法,您应该考虑使用 jQuery https://jquery.com/这将帮助您处理 AJAX 请求,并且您可以简单地删除 div 的内容,而不是进行重定向包含日志。
请注意您的代码中的一些拼写错误,文件名为“Index.php”,它应该区分大小写,因此请始终调用它:index.php
推荐阅读
- html - 在屏幕中央创建一个浮动 iframe
- three.js - 从辅助“调试”相机查看时,三个 js 相机助手不移动
- javascript - 是否可以创建与 Java 等效的 UUID 生成器的 Javascript 版本
- batch-file - 使用批处理文件添加到 PATH 环境变量 (Windows 10)
- spring - Spring Integration 挂起,Aggregator 未从其输入通道轮询
- solr - 从 solr 4 升级到 solr 7 后查询不再工作(edismax 中的 Occur Should vs Occur Must)
- java - 油漆组件中的 g 参数(图形 g)
- javascript - CSS JQuery动画多个div在同一个地方无限时间淡入淡出
- google-cloud-platform - 从 JSON 密钥文件将凭据传递给 Big Query
- python - 商业网站的合理股价信息(不是 alpha vantage 或 quandl)?