Cookie add on button hit
Solution 1
I suggest using the jQuery-cookie plugin. Here's a few examples of usage:
// Create a cookie
$.cookie('the_cookie', 'the_value');
// Create expiring cookie, 7 days from then:
$.cookie('the_cookie', 'the_value', { expires: 7 });
// Read a cookie
$.cookie('the_cookie'); // => 'the_value'
$.cookie('not_existing'); // => null
// EDIT
// Attaching to a button click (jQuery 1.7+) and set cookie
$("#idOfYourButton").on("click", function () {
$.cookie('the_cookie', 'the_value', { expires: 7 });
});
// Attaching to a button click (jQuery < 1.7) and set cookie
$("#idOfYourButton").click(function () {
$.cookie('the_cookie', 'the_value', { expires: 7 });
});
You will also need to add a check that the cookie exists (for when the browser is reloaded:
if ($.cookie('the_cookie')) {
// Apply rule you want to apply
$('.ClassToSelect').css("display", "none");
}
Solution 2
Instead of cookies, I recommend you use localStorage.
dvlden
Hi, my name is written above, but the artist within me is called dvL. I'm full-stack developer & designer, but also more than "just" that... 💻 🤘
Updated on June 04, 2022Comments
-
dvlden almost 2 years
I have a problem with adding a cookie. Read a couple of answers, but it's hard to understand if you never worked with them before.
What I basically want is to add a cookie if someone click on the specified button. So for example, if person clicked on the "like button", hidden content will be revealed no matter if he go forward/back or refresh page and cookie shall be removed after a couple of days.
What I used to hide the content is following:
HTML:
<div id="fd"> <p>Button from below will become active once you hit like button!</p> <div id="get-it"> <a class="button"><img src="img/get-button.png"></a> </div> </div> <div id='feedback' style='display:none'></div>
javascript:
FB.Event.subscribe('edge.create', function (response) { $('#feedback').fadeIn().html('<p>Thank you. You may proceed now!</p><br/><div id="get-it"><a class="button2" href="pick.html"><img src="img/get-button.png"></a></div>'); $('#fd').fadeOut(); });
However if I hit refresh or go back/forward on the content page, it will be hidden again. This is reason why I want to add a cookie on button hit. Anyone who can give me some explanations or example code?
-
James Hill about 12 yearsWhat about browsers that don't support
localStorage
? -
Yusuf X about 12 yearsThat's a valid question; localStorage is widely supported and better than cookies, but if you're targeting an even wider set of browser versions, then jQuery-cookie is even widelyer.
-
dvlden about 12 yearsI see for localstorage is also sayin' it can be for session (one time) or local (forever)... I need something that will be for lets say 5 days , such as cookies...
-
dvlden about 12 yearsYep, I saw this in one of the questions here as answer. What I don't understand as mentioned, is how to integrate it on button hit. I am struggling really hard.
-
James Hill about 12 years@NenadNovakovic, See last example marked
EDIT
. To be honest, if you're struggling with attaching to event handlers, you need to go through some JS tutorials. -
dvlden about 12 yearsAmazing. Thank you for that. A couple of minutes, to try. I bet it is problem solved. Will mark it up if it is!
-
James Hill about 12 years@NenadNovakovic, mark up for my effort, mark as answer if it works ;-)
-
Yusuf X about 12 yearsThen cookies will more convenient from a development standpoint, although in theory you can do expiration with localStorage.
-
James Hill about 12 years@NenadNovakovic, Respectfully, SO is not a place where people write all your code for you. The example I've given shows you how to set a cookie AND retrieve the value of the cookie that was set. I've given you everything you need to make this work. I will tell you that your selector is incorrect on your form.
.button2
currently selects nothing. -
dvlden about 12 yearsOkay just don't get mad ;) I will keep struggling if you say that it is everything I required. Cheers!
-
James Hill about 12 years@NenadNovakovic, I'm not mad at all - just wanted to let you know what's up :)
-
dvlden about 12 yearsStill nothing man. Either I am totally dumb or this is just too hard :) ! Was reading some more answers and saw that ID should be added on button href actually... Still no idea if cookie is being added and i am sure that there is something missing. If cookie is added, another script cannot know should it show content for the cookie. I need more help :(