X

LATEST #JQUERY NEWS

How to Use jQuery to Check if Cookies are Enabled


A cookie (not the kind with chocolate chips) is a small piece of data sent by a website and stored in a user’s computer by their web browser. Cookies are used mainly to store data about you as an internet user and what types of pages you visits, products you buy, etc, to help create a web page or a user experience (think ads) tailored to suit you and your preferences. This is why if you’ve viewed a particular pair of pants on an eCommerce website recently, you might see an ad for those same pants later when browsing Facebook or reading the New York Times — this kind of integration is made possible through the use of cookies.

As a user and consumer, you can decide whether or not you choose to enable cookies on your own personal web browser. As a web developer, however, it may be important for you to know if a user has cookies enabled on his or her browser, depending on what kind of project you’re working on. If this is the case, then you can actually check if a user has enabled cookies or not using the following straightforward jQuery snippet:

$(document).ready(function() {
    var dt = new Date();
    dt.setSeconds(dt.getSeconds() + 60);
    document.cookie = "cookietest=1; expires=" + dt.toGMTString();
    var cookiesEnabled = document.cookie.indexOf("cookietest=") != -1;
    if(!cookiesEnabled){
        //cookies are not enabled
    }
});

The snippet above is pretty simple. It works by trying to set a cookie. If it works, then you know that cookies are enabled on the browser. If it doesn’t then you’re out of luck.

There’s also a way to check and see if cookies are enabled in the browser using really simple, straight JavaScript. The Navigator cookieEnabled property returns a boolean value (true or false) that gives you a very straightforward answer to the question, “are cookies enabled on this browser?”

Here’s how you would use it:

var c = "Cookies enabled:" + navigator.cookieEnabled;

The result of the variable c would be

Cookies enabled: true

If cookies were enabled on the browser, or

Cookies enabled: false

If cookies were not enabled on the browser. Doesn’t get much more simple and straightforward than that!

The only downside to using the JavaScript boolean property¬†instead of the jQuery code is that the jQuery code provides you with a function that allows you to take action if cookies are not enabled in the browser. If you’d like to do the same with the navigator.cookieEnabled property, you’d have to write a function for yourself.

Recently Published

article image
»

How to Use Google Analytics with jQuery Mobile

jQuery Mobile is an HTML5 based web-page framework that’s ...

article image
»

jQuery Snippets: Using jQuery to Check All Boxes

When you’ve given your users a ton of¬†checkbox input fields ...

article image
»

Useful jQuery Code Snippets for Working with Images

Images are an essential part of any website and sometimes working ...

article image
»

How to Use jQuery to Check if Cookies are Enabled

A cookie (not the kind with chocolate chips) is a small piece of data ...

article image
»

A Beginner’s Guide to jQuery’s Selectors

We talk a lot about event methods on this site, but not so much about ...

article image
»

Add Keyboard Shortcut to Anchor Tag Using jQuery

Making a user friendly website can be quite a challenging task. There ...

Screen Shot 2017-04-23 at 10.15.41 AM
»

How to Use jQuery to Create a Sticky Navigation on Scroll

Creating “sticky” elements is something that can often be ...

article image
»

How to Use jQuery’s Keystroke Methods

jQuery has a few built-in keystroke methods that are all triggered by ...

article image
»

How to Change iFrame Styling Using jQuery

If you’ve ever had the displeasure of working with iFrames, ...