How Can I Hide A Button If Javascript Is Disabled?

I have a website that allows users to create new content and I use javascript as a way to check for spam. If user has javascript turned off how can I hide or disable the post searc

Solution 1:

You could just use a noscript tag, in your head that is only loaded when javascript is disabled.

HTML

<noscript><styletype="text/css">#creatingpost {
           display: none; 
         }

         #noJsBanner
         {
            display: block;
         }
    </style></noscript>

Check this demo with JavaScript disabled.

Solution 2:

Why not show the "no JS" version by default and toggle it with JavaScript (that will obviously only run if JS is enabled)?

HTML:

<divclass="js-show"><inputtype="Submit"value="Go!" /></div><divclass="js-hide"><p>Please switch JavaScript on.</p></div>

CSS:

.js-show
{
    display: "none";
}

JavaScript (jQuery):

$(function() {
    $('.js-hide').hide();
    $('.js-show').show();
});

Fiddle.

Alternatively, you could place a "no-js" class on the html element and swap it for "js" on document.ready, then style things with these classes accordingly.

Either of these approaches gives you a flexible way of creating JS-free alternatives for features across your entire site with only a couple of lines of code.