CODEWITHSUNDEEP
javascriptjqueryhtmldom
Aiden Bell
Aiden Bell

Reputation: 28386

jQuery events and .load()

Never ran into this problem with jQuery before. I have the following:

$(document).ready(function() {
    $('#browser_cat a').click( function() {
        $('#browser_cat').hide();
        $('#browser_cat').load('/api/browser/catchildren/'+$(this).attr('id'));
        $('#browser_cat').fadeIn();
        return(false);
    })
});

Pretty simple stuff. And it works, however the data gathered by .load() doesn't retrigger the event. It is a drill-down category type thing ... so level-1 does the load but then leve-2 bails to the href rather than triggering the click() event again.

The loaded HTML is a #browser_cat with links, and the generated DOM is OK.

I appriciate this is elementary. Thanks in advance.

Answer modified code: 

$(document).ready(function() {
    $('#browser_cat a').live("click", function() {
        $('#browser_cat').hide();
        $('#browser_cat').load('/api/browser/catchildren/'+$(this).attr('id'));
        $('#browser_cat').fadeIn();
        return(false);
    })
});

Upvotes: 3

Views: 146

Answers (1)

rahul
rahul

Reputation: 187040

Use live event

Attach a handler to the event for all elements which match the current selector, now or in the future.

Replace

$('#browser_cat a').click( function() {

with

$('#browser_cat a').live("click", function() {

Upvotes: 5

Related Questions