How to detect if JavaScript is disabled?

Question

There was a post this morning asking about how many people disable JavaScript. Then I began to wonder what techniques might be used to determine if the user has it disabled.

Does anyone know of some short/simple ways to detect if JavaScript is disabled? My intention is to give a warning that the site is not able to function properly without the browser having JS enabled.

Eventually, I would want to redirect them to content that is able to work in the absence of JS, but I need this detection as a placeholder to start.

Answer 1

I think you should add .02 here. It's not 100% perfect, but I think it's good enough.

But, the problem is with the preferred example of putting up some sort of "this site doesn't work so well without Javascript" message is that you then need to make sure that your site works okay without Javascript. And once you've started down that road, then you start realizing that the site should be bulletproof with JS turned off.

Therefore, what you really want is a "redirection" to a page that says "turn on JS, silly". But, you can't reliably do meta redirections. So, you can use like this:

<noscript>

    <style type="text/css">

        .pagecontainer {display:none;}

    </style>

    <div class="noscriptmsg">

    You don't have javascript enabled.  Good luck with that.

    </div>

</noscript>

Here, all the content on the site is wrapped with a div of class "pagecontainer". The CSS inside the noscript tag will then hide all of your page content, and instead, display whatever "no JS" message you want to show. This is actually what Gmail appears to do...it's good enough for Google.