堆栈内存溢出
  繁体   English   中英

如何使用 PHP 中的表单按钮销毁/重置 session

[英]How to destroy/reset a session with a Form Button in PHP

 原文  2020-10-08 13:59:33  6   1    php

问题描述

我正在尝试销毁/重置我的 session，以便它清除我在按下表单中的重置按钮时创建的日志div。 我已经从 a.js 文件中为我的按钮 ( btnReset ) 分配了一个方法，该方法清除了整个页面。 现在我只想让它清除存储我所有计算的Logs div。 我不知道该怎么做。

任何帮助将不胜感激。 SESSIONS 对我来说还是很陌生，所以我正在尽力去理解它。 如果有人能向我解释如何在按下重置按钮以销毁/重置我的 session 后正确清除日志div，将不胜感激！

Index.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;
}

1 个解决方案

解决方案1
 0  2020-10-08 17:02:19

您基本上需要按以下方式调整代码：

  • btnReset 应该为 session 发送特定标志以被销毁

  • btnReset 应该等待请求完成，然后进行重定向。

  • 在 PHP 上，你应该检查标志，如果找到，删除 session。

     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 (calucations.php) 中：

if(@$_GET['reset'] == true) {
    $_SESSION["results"] = [];
    session_destroy();
}

当然，这是一种简单的方法，您应该考虑使用 jQuery https://jquery.com/这将帮助您处理 AJAX 请求，并且无需进行重定向，您可以简单地删除 div 的内容包含日志。

请注意您的代码中的一些拼写错误，文件名为“Index.php”，它应该区分大小写，因此请始终称其为：index.php

解决方案2
 0  2020-10-08 23:47:20

我正在尝试销毁/重置我的会话，以便在我按下表单中的重置按钮时清除我创建的日志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;
}

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何一键销毁php会话 PHP session 复位按钮 单击浏览器后退按钮时如何破坏PHP中的session？ PHP表单重置按钮 - 使用method =“get”清除会话 在php中，如何销毁会话变量 PHP 破坏 session 浏览器后退按钮问题 PHP Session 在注销按钮上销毁 销毁/重置后，PHP会话未失效，仍然有效 PHP PDO如何重置/销毁持久连接 （PHP）如何正确销毁会话cookie？
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM