Question

I’m going to try and explain this the best I can…

I have one page that calls to certain js file with multiple live functions.

JS File #1

$("#1").live("click.1",function() { }
$("#2").live("click.2",function() { }
$("#3").live("click.2",function() { }

JS File #2

$("#4").live("click.3",function() { }
$("#5").live("click.4",function() { }
$("#6").live("click.5",function() { }

Depending on the id I click, It is supposed to activate one js file while inactivating the other js file’s functions. The problem I am having is… How do I unbind or die() all js functions from the previous click so when I toggle back it won’t cycle through the js more than once? I need to do this on a scalable level rather than unbinding each one individually. Thanks

Answer 1

Ideally you should be using on() (http://api.jquery.com/on/) as live() is deprecated. You should update your jQuery src file to the most recent version. You can unbind within each function by doing:

$(this).unbind();

If you are loading this content via ajax then unbind will work but if you are reloading the page then the events will rebind when the DOM is recreated.