tags:

views:

22

answers:

1

So I created a couple of functions for my search autocomplete results (custom autocomplete) and while the results were static, the hover and click events worked fine...

but now that the results are dynamically being generated, my divs no longer respond to their hover and click events.

Is jQuery not seeing the divs anymore because they're dynamic? Should I be creating these events when the results are returned? It can't be that difficult...

+2  A: 

If you show us some code we can be more directly useful, however I can tell you that most likely the cause of the problem you describe comes from your content being replaced dynamically, which is causing the hover and click events to be lost (read: not re-applied). Fortunately, you just need to call the $.live() method in jQuery to ensure that any time your matching elements are replaced, they will automatically be re-bound.

The $.live() function has the exact same syntax as $.bind():

$('.linkButton').live('click', function() {
    // click handler goes here
});
Nathan Taylor
I can recall the moment I was cursing for the loss of scope with the event-binding. But $.live really saves the day! :)
Justus Romijn
This is fantastic... so in any case when an event may be dynamic, I wrap it in a "live" function?
dcolumbus
Guys, I tested it and it works fantastically! What is the main difference between "bind" and "live"?
dcolumbus
@dcolumbus As I attempted to indicate in my answer, the difference between $.bind() and $.live() is that $.live() bindings retain their selector and automatically attach to future elements which match it, while $.bind() resolves the selector and then 'forgets it'. Here's another answer to the question: http://stackoverflow.com/questions/937039/what-is-the-difference-between-the-bind-and-live-methods-in-jquery.
Nathan Taylor
Perfect, thank you!
dcolumbus