Search code examples
phpjavascriptnoscript

PHP & <noscript> combination to detect enabled JavaScript in browser


Is this correct? If not what is the correct syntax

I am new to php hence trying to learn.

    <?php
    // Check browser for JavaScript support

        $jsSupport='true'; ?>

        <noscript><?php $jsSupport='false'; ?></noscript>

        <?php
        if ($jsSupport == 'false') {

        include ('no-script-layout.php');

        } else {

        include ('regular-layout.php');

        }

     ?>

Or is there a better way to handle this?


Solution

  • <noscript> tags

    You can use the noscript tags to display content to browsers with javascript disabled or redirect them to another page (a nojs-version.php for example).

    <!-- Redirect to another page (for no-js support) (place it in your <head>) -->
    <noscript><meta http-equiv="refresh" content="0;url=nojs-version.php"></noscript>    
    
    <!-- Show a message -->
    <noscript>You don't have javascript enabled! Please download Google Chrome!</noscript>
    

    Modernizr

    The better way to handle javascript detection (& feature) would be to use Modernizr: http://modernizr.com

    Check out this SO question: What is the purpose of the HTML "no-js" class?

    A basic example (without Modernizr)

    You could add the class no-js on page load to your <body> tag. Then when the page loads and if javascript is enabled, you can replace the no-js with js like so:

    // When the DOM is ready & loaded, do this..
    $(document).ready(function(){
        // Remove the `no-js` and add the `js` (because JS is enabled (we're using it!)
        $('body').removeClass('no-js').addClass('js');
    
        // Assign it to a var so you don't traverse the DOM unnecessarily.
        var useJS = $('body').hasClass('js');
        if(useJS){
            // JS Enabled
        }
    });
    

    The above code is a very basic example of how modernizr works. I would highly recommend just using that.

    Check out Modernizr