ajax - Can I make another ajax request inside an ajax container?

Question

I'm using ajax to pull in content to create a light box type content page. It also has a next and prev button once loaded so hence the use of ajax.

I wanted to use Ajax for the page navigation too. But if someone clicks a page link and then tries to use the light box feature both the jquery and ajax requests no longer work within the loaded area.

I've read a lot about bind and delegate but not sure how to use them in this context

Here's my main pieces of code:

// This gets called on document ready

    function clicky() {
        $link.click(function(e) {
            e.preventDefault();
            var linkPage = $(this).attr('href');

            if ($(this).hasClass('pages')){

                // PAGE specific code
                if ($('body').scrollTop() != 0) {
                    $('body').animate({ scrollTop: 0 }, 500, function(){
                        pageLoad(linkPage);
                    });
                } else { pageLoad(linkPage); }
                console.log('page');

            } else {

                // PRODUCT specific code
                if ($('body').scrollTop() != 0) {
                    $('body').animate({ scrollTop: 0 }, 500, function(){
                        productLoad(linkPage);
                    });
                } else { 
                    productLoad(linkPage);
                }

            }        
        });
    }

Here's my ajax for the two different areas:

// Ajax stuff going on for pages

    function pageLoad(linkPage) {

            // Page stuff fades out

            history.pushState(null, null, linkPage);
            $("#page-content").load(linkPage + " #guts", function(){

               // Loads in page content

            });

    }

    // Ajax stuff going on for Products

    function productLoad(linkPage) {

            // Page stuff fades out

            history.pushState(null, null, linkPage);
            $("#product-content").load(linkPage + " #guts", function(){

            // Shows an overlay/lightbox and loads in content

            });

    }

Edit: This worked for me

$(document).on('click', '.link' , function(){

  console.log('this worked');
  return false;

});

Answer 1

这有效：

 $(document).on('click', '.link' , function(){
    console.log('this worked');
    return false;
 });