LoolKovsky
LoolKovsky

Reputation: 1058

Hiding button using jQuery

Can someone please tell me how I can hide this button after pressing it using jQuery?

<input type="button" name="Comanda" value="Comanda" id="Comanda" data-clicked="unclicked" />

Or this one:

<input type=submit  name="Vizualizeaza" value="Vizualizeaza">

Upvotes: 22

Views: 173569

Answers (4)

Rikki
Rikki

Reputation: 3528

Try this:

$('input[name=Comanda]')
.click(
     function ()
     {
         $(this).hide();
     }
);

For doing everything else you can use something like this one:

$('input[name=Comanda]')
.click(
     function ()
     {
         $(this).hide();

         $(".ClassNameOfShouldBeHiddenElements").hide();
     }
);

For hidding any other elements based on their IDs, use this one:

$('input[name=Comanda]')
.click(
     function ()
     {
         $(this).hide();

         $("#FirstElement").hide();
         $("#SecondElement").hide();
         $("#ThirdElement").hide();
     }
);

Upvotes: 39

Jo&#227;o Cunha
Jo&#227;o Cunha

Reputation: 3766

jQuery offers the .hide() method for this purpose. Simply select the element of your choice and call this method afterward. For example:

$('#comanda').hide();

One can also determine how fast the transition runs by providing a duration parameter in miliseconds or string (possible values being 'fast', and 'slow'):

$('#comanda').hide('fast');

In case you want to do something just after the element hid, you must provide a callback as a parameter too:

$('#comanda').hide('fast', function() {
  alert('It is hidden now!');
});

Upvotes: 6

David
David

Reputation: 218827

It depends on the jQuery selector that you use. Since id should be unique within the DOM, the first one would be simple:

$('#Comanda').hide();

The second one might require something more, depending on the other elements and how to uniquely identify it. If the name of that particular input is unique, then this would work:

$('input[name="Vizualizeaza"]').hide();

Upvotes: 1

Blender
Blender

Reputation: 298176

You can use the .hide() function bound to a click handler:

$('#Comanda').click(function() {
    $(this).hide();
});

Upvotes: 9

Related Questions