Question

I have a problem with jQuery click event handling.

Here’s my code:

$j("#btn_renommer_groupe").click(function(){
  document.forms['creation_edition_groupe'].reset();
  $j("#img_saisie_nom_groupe").hide();
  $j("input[name=creation_groupe]").css("background-color", "#f0f0f0");
  fun_renommer_groupe();
})

function fun_renommer_groupe(){
  alert('test');
}

The problem is, when I click on the button the alert message is display many time.

does anyone have an idea why this is happening?

EDIT:

Thx for your response. I can’t post all the js file (more than 1000 lines) but Here are two unique operations that I do on this button

$j("#btn_renommer_groupe").unbind('click');

and

$j("#btn_renommer_groupe").bind('click', function(){fun_renommer_groupe();});

Answer 1

I think the problem is you’re binding click event to the same control way too many times.

this

$j("#btn_renommer_groupe").click(function(){
  ...
  fun_renommer_groupe();
})

and this

$j("#btn_renommer_groupe").bind('click', function(){fun_renommer_groupe();});

will result in fun_renommer_groupe() called twice on btn_renommer_groupe click event, see what I mean in this example: http://jsfiddle.net/DpCDh/

Make sure you only bind it once and you’re sorted!