Hiding button using jQuery

Question

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">

Rikki · Accepted Answer · 2014-11-27 07:08:37Z

39

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();
     }
);

edited Nov 27, 2014 at 7:08

answered Oct 8, 2012 at 22:25

Rikki

3,5681 gold badge25 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

LoolKovsky Over a year ago

thanx, but if I want to hide more buttons after clicking one button, what can I do?

Rikki Over a year ago

Hiding more buttons by which parameter? I mean how you want to find them? by className, id, name, by what?

LoolKovsky Over a year ago

Every button has a unique id no classes nothing. I want to hide the 2 buttons in my example.

Rikki Over a year ago

See the update. I think you should have a look at selector discussion in the jquery things. It will help you to do complex queries in finding elements. Cheers

Tikeb Over a year ago

Quick query - why not use the Id selector instead of the input name? Surely the Id will be quicker? As in Blender's answer ($('#Comanda')).

|

Blender · Accepted Answer · 2012-10-08 22:23:09Z

9

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

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

answered Oct 8, 2012 at 22:23

Blender

300k55 gold badges462 silver badges511 bronze badges

1 Comment

David Over a year ago

@TothLudovicAndreas: Is this answer not working for you in some way? Can you elaborate on why not? When you start getting into "hide and show and other stuff" you start to leave the scope of a single question and move toward the scope of needing some tutorials on jQuery (or even JavaScript in general).

João Cunha · Accepted Answer · 2012-10-08 22:33:40Z

6

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!');
});

answered Oct 8, 2012 at 22:33

João Cunha

3,7663 gold badges24 silver badges33 bronze badges

Comments

David · Accepted Answer · 2012-10-08 22:24:16Z

1

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();

answered Oct 8, 2012 at 22:24

David

221k42 gold badges245 silver badges337 bronze badges

Collectives™ on Stack Overflow

Hiding button using jQuery

4 Answers 4

6 Comments

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

6 Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related