Sergi
Sergi

Reputation: 71

How can I associate 1 cookie with either of 2 buttons using jquery?

I have been asked to assign a cookie titled "visitor" that will allow us to determine which button our site visitor has clicked on, "villian" or "hero". Depending on what they clicked, we will route them automatically on their return visit.

Do I need more than 1 cookie to accomplish this task? Or can I accomplish this with just one cookie as they've asked me to.

How can i associate the cookie(s) to the linked button?

Here's my code so far (and I'm using the jquery.cookie plugin):

<a href="villain.html" id="villain"><button>villian</button></a><br>

<a href="hero.html" id="hero"><button>hero</button></a>

and here's my js:

$.cookie("visitor","villain",{ path: '/', expires: 1 }); $.cookie("visitor02","hero",{ path: '/', expires: 1 });

Upvotes: 0

Views: 30

Answers (1)

Arun P Johny
Arun P Johny

Reputation: 388436

You need only one cookie, and then on the click handler of the button you can assign the value of the cookie.

In one approach we can use a class based click handler and a data-* attribute to achieve this as below

<a href="villain.html" id="villain" class="visitor" data-visitor="villian"><button>villian</button></a>
<br>
<a href="hero.html" id="hero" class="visitor" data-visitor="hero"><button>hero</button></a>

then

jQuery(function ($) {
    $('.visitor').click(function () {
        $.cookie("visitor", $(this).data('visitor'), {
            path: '/',
            expires: 1
        });
    })
})

Upvotes: 0

Related Questions