使按钮永久消失 [英] Make button disappear permanently

问题描述

我有一种情况，当用户单击页面A中的按钮时，该按钮将消失并转到页面B.而当用户返回页面A时，该按钮仍将消失.是否有可能做到这一点?这听起来合乎逻辑吗?

I have a situation, when the user clicks a button in page A the button will disappear and go to page B. and when the user goes back to page A, the button will still disappear. Is it possible to do this? Is this sounds logical?

<table>
        <tr>
            <th>Booking Number</th>
            <th>checkin</th>
            <th>checkout</th>
            <th>Num. of days</th>
            <th>Total Charges</th>
            <th>Breakfast</th>
            <th>accommodation ID</th>
        </tr>
    <c:forEach items="${books}" var="book">
            <tr>
                <td><c:out value="${book.bookingnum}" /></td>
                <td><c:out value="${book.checkin}" /></td>
                <td><c:out value="${book.checkout}" /></td>
                <td><c:out value="${book.numofdays}" /></td>
                <td><c:out value="${book.totalcharges}" /></td>
                <td><c:out value="${book.bfast}" /></td>
                <td><c:out value="${book.accid}" /></td>
                <td>
                <form name="reserveSubmitForm" method="post" action="Payment1Controller?action=createPayment&bookingnum=<c:out value="${book.bookingnum}"/>">
                <input  type="submit" class="btn btn-primary btn-block" value="Pay">onclick="style.display = 'none'"
                <input type="hidden" name="totalcharges" id="totalcharges" value="${book.totalcharges}"/>
                </form>
                </td>
            </tr>
    </c:forEach>
</table>

推荐答案

单击按钮时，可以在sessionStorage中设置一个值.另外，在页面加载时，请检查该值是否在sessionStorage中存在，如果存在，请隐藏该按钮.例如:

When the button is clicked, you can set a value in sessionStorage. Also, on page load, check to see whether that value exists in sessionStorage, and if it does, hide the button. For example:

<a href="foo">foo</a>

JS:

const a = document.querySelector('a');
if (sessionStorage.clickedA) a.style.display = 'none';
a.addEventListener('click', () => {
  sessionStorage.clickedA = 'clicked';
});

https://jsfiddle.net/qfsuLyc3/

我认为cookie不是一个好主意，因为它的信息似乎只与客户端有关，而与服务器无关. (Cookie将发送到服务器)

I don't think cookies are a good idea because it's information that seems to be only relevant for the client, not the server. (cookies will be sent to the server)

sessionStorage在页面会话中持续存在.如果您希望即使在重新打开浏览器后也隐藏按钮，请使用localStorage代替，它使用文件系统而不是内存，并且是持久的.

sessionStorage persists over a page session. If you want the button to be hidden even after the browser is reopened, use localStorage instead, which uses the file system, rather than memory, and is persistent.

这篇关于使按钮永久消失的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！