CODEWITHSUNDEEP
javascriptjquerycoffeescript
Pwnna
Pwnna

Reputation: 9538

jQuery click event firing twice?

This is a fairly weird case, you can see the code here:

http://jsfiddle.net/zpZtH/2/

Upvotes: 1

Views: 4747

Answers (3)

Abdul Jabbar
Abdul Jabbar

Reputation: 5971

This is a common Bug in Javascript. you can find many articles around internet specially on SO for event being fired twice. You can try something like this 

 $(document).on('click', '#task-list li', function(e)
 {
       alert('Hellow world');
       e.stopPropagation();
       return false;
 });

And it's definitely Javascript problem because if you hit google and search for event fire twice you will see that Angular, Jquery and backbone etc all are somewhere firing events twice or even thrice. So, it's seems that it's javascript behind this. And off course if you search this with Mozilla Developers Network then you can see experts have also said so.

Upvotes: 0

Ram
Ram

Reputation: 144739

you should not wrap input elements by using a label element, try this:

<label for="average-data" class="section-view-time-checkbox">
    <span class="custom checkbox checked"></span> Average  
</label>
<input type="checkbox" id="average-data" style="display: none;">

http://jsfiddle.net/zpZtH/7/

Upvotes: 1

nbrooks
nbrooks

Reputation: 18233

http://jsfiddle.net/Cc55g/

You need to call event.preventDefault() within your click handler. This prevents the default click action from being executed once your custom function runs. The second alert is occurring because the form is being submitted.

Upvotes: 0

Related Questions