How to know and handle disabled javascript in browser

Advertisement

In this blog, I’ve been writing a lot of tips and tutorials using JavaScript. I really love JavaScript and hope that you guyz also like it. But what to do when JavaScript is disabled in the client’s browser?. I would like to redirect the visitor to a warning page where he’ll be suggested to enable the JavaScript.

In many scenario, we must need JavaScript in some pages and we never want to process that page.In this post, I’ll show you how to know and handle the disabled JavaScript in browser.

First click on the below link to see a JavaScript enabled page. Now, disable the javaScript in browser and click the below link.

View the Demo

How to know JavaScript is disabled in browser?

As you guyz know, <script></script> tag is used for javaScript. Same way there is <noscript></noscript> tag which gets in action when the Javascript is diabled in browser.

<script>code here gets executed when javascript is enabled</script>
<noscript>code here gets executed when javascript is diabled</noscript>

How to handle diabled javascript in browser?

When javascript is diabled I always want user to be redirected to a page to show warning to enabled javascript.But, JavaScript is diabled how to do this ? well there is meta tag in HTML named “meta refresh” which will redirect you to another page in the interval specified in that header

<noscript>
  <META HTTP-EQUIV="Refresh" CONTENT="0;URL=disabled.html">
</noscript>

As, you can see above code inside noscript, there is “meta refresh” tag with intevel of “0″ second. As, the javascipt is disabled in that page, the browser gets redirected to “disabled.html” to show some warning message

Download Example Files

Popularity: 5% [?]

Enter your email address and get free tutorials, tips and tricks of PHP, Ajax, JavaScript and CSS directly delivered to you email inbox:

Related Posts

» How to hide actual URL in the status bar of all browsers?
» Handling array of HTML Form Elements in JavaScript and PHP
» Creating and Parsing JSON data with PHP
» Prevent form post request from another domain in PHP

16 Comments on “How to know and handle disabled javascript in browser”

  • Jason wrote on 29 April, 2008, 0:51

    There is no good reason today to use the noscript tag. It may take a bit more thought up front but it is much better to use unobtrusive JavaScript techniques. For example, you can create a simple message in a unique tag (such as p) at the beginning of your markup indicating that JavaScript is required to get full use of your site/application. Then, all you need to do is $(“#uniqueId”).hide() the element using JavaScript, and you avoid the need for a redirect or other harsh punishment for disabling scripting.

  • Roshan wrote on 29 April, 2008, 5:25

    jason..you are right and it would be better not to give punishment..but If you’ve a highly rich javascript application then you really don’t want to use the website to be browsed with disabled javascript…but If the page don’t have rich user interface then your solution is highly accepted..

  • Ashley Smith wrote on 29 April, 2008, 5:43

    I see both your points but I do believe what Roshan is saying, if your application rich enough there is no reason to keep them on that page.

    Redirect them to a page letting them know your page is safe and let them know the benefits of enabling JavaScript.

  • tevan wrote on 30 April, 2008, 1:09

    what ashley said. javascript-intensive pages should redirect to a separate page for site visitors with javascript disabled. it doesn’t make sense to extensively code an application to allow visitors with javascript disabled to view the site when the majority of the intended functionality is disabled. wouldn’t viewing a disabled site (without being redirected) be a punishment in itself? what jason said — unobtrusively hiding page elements rather than redirecting visitors — would make more sense when applied to less javascript-heavy sites.

  • Neru wrote on 30 April, 2008, 13:06

    by the way, noscript tag is not allowed in head tags. so if you are addicted to w3c standards and green html tidy tick in firefox, this usage would be problematic.

  • Roshan wrote on 30 April, 2008, 16:31

    Ya Neru right…if you want your page to be validated from w3c please don’t use noscript tag inside head tag…

  • Neru wrote on 30 April, 2008, 19:31

    another addition :)
    being curious, i just disabled javascripts and tried some websites like google reader, team vidget, script.aculo.us etc, there are 3 different solutions for these javascript disabled browsers,
    1) use roshan’s solutions and redirect another page.
    2) use jason’s suggestion and display a “javascript should be enabled” message
    3) given up some navigation and content display effects and making site usable both javascript enabled and disabled cases.

  • Ticonetster wrote on 28 July, 2008, 13:15

    Yeah I use the noscript option to give some kind of message but i didn’t know that you can use those meta tags like that. Sweet! thanks man.

  • Daniel wrote on 6 April, 2009, 5:45

    So, i read all this for nothing, in the end this is not valid by W3C :(
    Don’t resolve a (@&#2**&@, sory but why in the first place, this fu99)ck brownsers has to allow users desable javascript? FUC…..CK! Sory i angry… another solution complacent with W3C?

    I dont want to do i site only for idiots who dont have js allowed!

  • Nick wrote on 18 July, 2009, 15:58

    Just another addition to this thread.

    Redirecting to another page is “cloacking” and will get your site banned by Google et al

    I have simply created 2 external css files, one called for js enabled browsers and one for those disabled. Yes that means 2 files, not one need to be maintained.

    I wanted to keep the features in my js requiring pages as I like them and for the minority of js disabled visitors the trade-off in restricted visual/functionality and file maintenance and impact is more than acceptable.

    I simply have an unthreatning tiny unobtrusive message saying enable js for a richer experience in the top right of my pages.

    ttfn

  • sanker wrote on 28 October, 2009, 9:07

    Thanks a lot for the idea.

  • Bony wrote on 16 February, 2011, 7:35

    It is very cool. Thanks for the script.

Trackbacks

  1. 30 Nisan 2008 web’den seçme haberler » Tekil Yaz? » Fatih Hayrio?lu'nun not defteri
  2. Display different text on status bar of hyperlink in all browsers
  3. ??????? » [Web] ????
  4. pligg.com

Write a Comment

 


Copyright © 2014 Roshan Bhattarai's Blog. All rights reserved.
Powered by WordPress.org, Custom Theme and ComFi.com Calling Card Company.