Why is the click event triggered multiple times in my script?

Question

I created a search button which has a click event. When I click it the very first time, it triggers once as expected. When I click it a second time it trigger twice and when I click on it again it trigger multiple times... Any idea why this is occurring?

This is the code for click event:

$("#search_top_form").delegate("#search_button","click",function(e) {   
            wrapperConsole('click search');
                alert("event trigger");                                    
            submitSearchForm();

        });

can you please provide the associated html code too . i would like to give it a try. — satin, Dec 01 '11 at 07:19

score 1 · Answer 1 · answered Dec 01 '11 at 07:16

1

my guess you are doing something like this http://jsfiddle.net/3756r/ meaning calling this delegate from submitSearchForm().

another potential problem i see here is if you are using an actual form and the button is a submit button, you have to pass event to the click function and call event.preventDefault() so the form won't submit

answered Dec 01 '11 at 07:16

Avi Pinto

4,266
2
24
24

i visit your link and it is same in my case .. when i click in your code result that is click me .result is the same as it in my case mutiple trigger – sandip Dec 01 '11 at 09:15
exactly - showed you what i think you are doing. you should call delegate only once and not from the even handler – Avi Pinto Dec 05 '11 at 10:50

score 1 · Answer 2 · answered Dec 01 '11 at 08:01

before delegate, add this undelegate("#search_button","click").delagate......

$("#search_top_form").undelegate("#search_button","click").delegate("#search_button","click",function(e) {   
            wrapperConsole('click search');
                alert("event trigger");                                    
            submitSearchForm();

        });

score 0 · Answer 3 · answered Dec 01 '11 at 07:26

0

I guess you reload this script part on every click. This means delegate works for each load and cause to trigger so many times.

You may try

$("#search_top_form").undelegate(...).delegate(..);

answered Dec 01 '11 at 07:26

adyusuf

806
1
11
27

score 0 · Answer 4 · answered Dec 01 '11 at 07:28

0

i am not an expert in jquery try this

$("#search_button").click(function(){ 
            wrapperConsole('click search');
                alert("event trigger");                                    
            submitSearchForm();
        });

answered Dec 01 '11 at 07:28

Nighil

4,099
7
30
56

1

This does look better to me... I'm not an expert either though – Ortund Dec 01 '11 at 08:14
Regarding: `.click()` vs. `.delegate()`, see [To use delegate() or not](http://stackoverflow.com/questions/7029178/to-use-delegate-or-not). – thisgeek Dec 01 '11 at 15:04

score 0 · Answer 5 · answered Dec 01 '11 at 07:30

0

why dont you use just something like that, why do u use delegate?

$('#target').click(function() {
  alert('Handler for .click() called.');
});

answered Dec 01 '11 at 07:30

Kemal Can Kara

416
2
15

Why is the click event triggered multiple times in my script?

5 Answers5