Search code examples
javascriptjqueryajaxjquery-load

jQuery load() dynamic content with clicks get fired as many times as loaded

I load content via jQuery load() but for each time I load a given page, the clicks on the pages gets fired multiple times. Why??

Se the fiddle here: http://jsfiddle.net/ZUZ3L/ph3tH/2/

Solution

  • It's because you're adding the click event multiple times.

    Every time your code runs, the click function is re-defined. When a click is redefined it won't replace the previous one, but instead will be added to the stack to be executed each time the "click" event occurs. This is applied to all events in jQuery.

    As you are loading via AJAX the vars and events in the document are still persisted. Meaning that you are just adding layer on top of layer of function calls to be executed each time you run your ajax call