Hide show content with Cookies

Question

I'd like to create a form that sets a Cookie on submission, then either hide or show content on subsequent pages depending on the existence of the cookie.

I've got using the jquery.cookie.js and this code on the form:

    $(document).ready(function () {
        $(".button").on('click',function() {
            $.cookie('showcontent', true, { expires: 7 });
          });
    });

And this code on the subsequent pages:

CSS

    .contentA {
    display: none;}

Javascript

if (!$.cookie('showcontent')) {
    $( ".contentA" ).show();
    $( ".contentB" ).hide();
}

HTML

<div class="contentA">  
    <h1>Content A</h1>
</div>

<div class="contentB">  
    <h1>Content B</h1>
</div>

At the moment it doesn't function, so any help would be really appreciated.

have you done the reverse for your if? You set it to true but then do an if on not true — Pete, Apr 28 '14 at 12:15

score 0 · Accepted Answer · edited May 23 '17 at 10:32

0

if you looks at this sample it works as it should, but since it is a cookie, cookies are text that are stored in the users browser, so it should be like this:

if ($.cookie('showcontent') == 'true')

and make sure to load jquery before adding the cookie library

edited May 23 '17 at 10:32

Community

1
1

answered Apr 28 '14 at 12:45

Jorge Y. C. Rodriguez

3,394
5
38
61

1

Many thanks, this and the comment above did the trick ie. add 'if not true' – user2409295 Apr 28 '14 at 13:26

Hide show content with Cookies

1 Answers1