How to close onclick once per session?

Question

I wrote this simple code for closing an span after clicking on X, but It loads every time I refresh page or go on another page.

function close() {
                var x = document.getElementById("header"); {
                        x.style.display = "none";
                }
        }

And this is the code in php:

<div id="header">
    <span style="vertical-align: middle; padding-top: 20px; font-weight: bold;"><a href=""><b></b></a></span>
    <div class="close-btn" style="position: absolute; display: inline-block; top: -4px; padding-right: 6px; color: #fff;"><span class="rwd-buttinette-icon rwd-icon-remove-circle-1" onclick="close()" style="float: right;"></span></div>
</div>

And I've tried with sessionStorage, but can't get it to work:

if (sessionStorage.getItem('Once') !== 'true') {
        function close() {
                var x = document.getElementById("header"); {
                        x.style.display = "none";
                }
        }
    sessionStorage.setItem('Once','true');
   }

I want it to load just once until it's closed and stays closed for that session. Can someone help me?

You can [add a cookie](https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie) after you close it for the first time. Before loading/showing the span again check for the cookie value. — Cray, May 07 '19 at 11:23
I'm not exactly sure, but doesn't refreshing your page terminates your session as well? — Krishna Prashatt, May 07 '19 at 11:24
A bit off-topic: In your `hinweisClose()` you check to see if the header was already closed, and then open it. I have two problems with this: 1. Usually you cannot open something after clicking on the X. 2. The name of the function is 'Close', and it can _open_ something? That doesn't compute. Isn't it better to call it a 'Toggle'? — KIKO Software, May 07 '19 at 11:25
You can use `localSession`. (if you want it to stay closed beyond the session, take a look at `localStorage`) — HTMHell, May 07 '19 at 11:26
check here : https://stackoverflow.com/questions/53999430/external-popup-onclick-to-open-only-once-per-session — , May 07 '19 at 11:31
@KIKOSoftware Yeah, that's probably a typo, it shoudn't open again, it should just stay closed. — asobak, May 07 '19 at 11:32
Possible duplicate of [External popup onclick to open only once per session](https://stackoverflow.com/questions/53999430/external-popup-onclick-to-open-only-once-per-session) — Nico Haase, May 07 '19 at 11:41
@NicoHaase Yeah, I saw that already, but it seems to complicated for a simple close button like this... — asobak, May 07 '19 at 11:44
@NicoHaase Because it has a lot of code, I've tried with sessionStorage but I can't get it to work... — asobak, May 07 '19 at 11:48
If you would share what you've tried and why **exactly** you're struggling with that, other people could help you to solve the problem — Nico Haase, May 07 '19 at 11:49
I'm sorry @NicoHaase, I tried that after posting the question and forgot to update it — asobak, May 07 '19 at 11:51
And what is the problem with the code you've posted now? Maybe you mixed up defining and calling the function? It should be fine to define it in every case, but only call it if the element is not found in `sessionStorage` — Nico Haase, May 07 '19 at 11:53
@NicoHaase So, it closes first time after load and then it doesn't work anymore, it just shows span and it doesn't want to close. — asobak, May 07 '19 at 12:03
...then maybe you need some code to achieve that? If you write markup that **shows** that ``, but write no code to hide it (either when clicking on that button, or when the session contains the information that it has been hidden before), it's obvious that the information stays visible — Nico Haase, May 07 '19 at 12:06
@NicoHaase There, I've updated the code, now it should only hide the div with id #hinweis_header, but it still doesn't work. — asobak, May 07 '19 at 12:10
What do you mean by "still doesn't work"? Where do you check whether that `div` should be hidden if the information is stored in the session? — Nico Haase, May 07 '19 at 12:12
@NicoHaase Then what should then be my syntax for javascript? — asobak, May 07 '19 at 12:16
That depends on whichever solution you're opting in, but it should not be hard to check for `sessionStorage.getItem('HinweisOnce')` (like you've already done before) and hide the `div` (like you've done before). Keep in mind that SO is not a free code-writing-service. You should show some attempts on your own — Nico Haase, May 07 '19 at 12:18
@NicoHaase As I already said, I'm opting in simple (javascript - which is not my best suit) with little code (example - sessionStorage) to close that span upon clicking X and not show it again until new session starts. I know that stackoverflow is not a free code-writing-service, but people are here to help. And from your sarcastic comments I got help that equals to zero... — asobak, May 07 '19 at 12:35
Sorry, it was not my plan to be sarcastic. But there are tons of tutorials out there, like https://stackoverflow.com/questions/16354301/show-welcome-div-only-once-per-user-browser-session or others. If you have any more precise question about them, show your attempts and others can help you - but you should at least try something and not wait for others to solve the problem for you. — Nico Haase, May 07 '19 at 12:41

Cray · Answer 1 · 2019-05-07T12:11:20.220

0

After closing the span add a cookie, for example:

document.cookie = "popup=closed";

Then you can check for the cookie before displaying the span again, for example:

isClosed = document.cookie.replace(/(?:(?:^|.*;\s*)popup\s*\=\s*([^;]*).*$)|^.*$/, "$1") === "closed";
if(isClosed) {
    displayMySpan();
}

You can read more about JS cookies here.

For PHP based solution you can still set the cookie after closing the span, something like:

document.cookie = "popup=closed; path=/";

Then in your PHP code you need something like:

if (isset($_COOKIE['popup']) && $_COOKIE['popup'] === "closed") {
    //code to display div here
};

edited May 07 '19 at 12:11

answered May 07 '19 at 11:36

Cray

2,774
7
22
32

I don't quite understand the answer, I've provided you with php code above. – asobak May 07 '19 at 11:49
If you need to display the span through PHP code then you need to read about setting cookies in PHP. However I feel like it would also be easy for you to display the span with javascript on page load. – Cray May 07 '19 at 11:54
Another [question](https://stackoverflow.com/questions/5045053/set-cookie-wih-js-read-with-php-problem) about using cookies in PHP that were set in JS. So you could still use the first line of my code (needs modifications as the link says) to set the cookie and in your PHP code access it to check whether it is needed to display the span. – Cray May 07 '19 at 11:58
It's displayed in html code but in php file is what I meant, and it should be loaded only once per session and then if I close it, it should stay closed until a new session, and not appear again when I go to some other page. – asobak May 07 '19 at 12:05
I can't write PHP for you, but what you need to do is following: 1. set cookie in JS, 2. read it in PHP, 3. display span accordingly – Cray May 07 '19 at 12:06
I added basic skeleton for PHP solution, but I am not able to test that code myself, so there may be some errors. – Cray May 07 '19 at 12:12

How to close onclick once per session?

1 Answers1