jquery click event

Question

can we use more than one click event in the Jquery as

$(document).ready(function(){
$('#button').click(function(){
...........click(function(){
...........click(function(){
});

$(this).hide();
});
}); 

pls help me

i wrap the code due to less space for the code

$('#togglebutton1').click(function() {
      if ($(this).is(':visible')){ 
          $('#bio>div,#heading2,#heading3 ').hide(); 
          $('#bio>div:first').show();
          $('p:first').toggle(
             function() { 
                 $(this).animate({ 'height': '+=15px' }, '1000', 'linear'); 
             }, 
             function() {
                 $(this).animate({ 'height': '-=15px' }, '1000', 'swing');
             }
          );
          $(this).val('ShowImage');
       }else { 
         $(' #bio > div,#heading2,#heading3 ').show(); 
         $(this).val('HideImage'); 
       } 
}); 
$('#bio h3').click(function() { 
     $(this).next().animate({ 'height': 'toggle' }, 'slow', 'easeOutBounce'); }); 
}); 

Answer 1

Yes you can bind more than one click event. Have a look at the jQuery "bind" method.

http://api.jquery.com/bind/

Answer 2

You can use the bind for that.

Example:

$('#foo').bind('click mouseenter mouseleave', function() {
  $(this).toggleClass('entered');
});

As can be seen, three evens are attached eg click mouseenter mouseleave to the element with id set to #foo.

Answer 3

yes you can... jQuery is good on chaining...

but I think you should clarify more on your question on what really you want to achieve... so that we can suggest more and better idea.. cheers!

Answer 4

Yes, you can bind multiple handlers to the click event of the same element:

$('#myElementID').click(function() {
    // do something here
})

// Elsewhere (presumably)
$('#myElementID').click(function() {
    // do something else here
})

Provided the first handler that gets called doesn't stop the event (via .stopPropagation() or by returning false from the handler), the next one will get called. jQuery guarantees that handlers will get called in the order in which they're registered (even when the browser doesn't). (This is covered in the bind docs, but applies to the click function as well, as click is just a shorthand version of bind for the click event.)

Answer 5

I think you may have meant running the same function on several different elements. This can be done as such:

$("#mydiv1, #mydiv2, #mydiv3").click(function(){
    //some code
});

Good luck!

Answer 6

$(function(){
    $('#link').click(function(e){
        e.preventDefault(); // unbind default click event
        function1();
        function2();
        function3();
        // or
        var $this = $(this);
        $this.function1();
        $this.function2();
        $this.function3();
    });
});