Jump to content

Open link in new window, but make it just like opening in original window


pintee

Recommended Posts

I have an index.php that loads a page.php into a #result div. Page.php in turn has its own links and I have it so that when you click on one of these links it loads the respective page into the SAME #result div. Similarly that loaded page might have its own links and I want to continue loading content into the same div. The code for this is as follows:

 

function loadPage(url){
$("#wrapper").load(url, function(){
$("#wrapper").find($('a')).each(function(){
$(this).on('click', function(e){
loadPage($(this).attr('href'));
e.preventDefault();
});
});
});
}

 

Say page.php has a link to page2.php.

At the moment when I open the link to page2.php in a new window, it opens as page2.php. Same if I type the url to page2.php directly into my browser. I want it so that it opens as index.php but with page2.php loaded into its #result div(a duplicate of clicking the link normally in the original window).

How do you do this?? I have tried lots of things including setting a session variable and passing to loadPage, but nothing seems to work.

Edited by pintee
Link to comment
Share on other sites

Something like this works.

Demo: http://lightron.no-ip.org/tmp/47/

 

Javascript / JQuery

 

$(document).ready(function()
{
    function updateBinds()
    {
        $("#page a").click(function(e)
        {
            e.preventDefault();
            
            $("#page").load($(this).attr("href"), updateBinds);
            
            return false;
        });
    }
    
    updateBinds();
});
Link to comment
Share on other sites

The problem is you're only binding the handler to the elements already defined in the page. When new content is loaded in, they're not bound to the handler. What you need to do, and what is more efficient than binding the same handler to every link, is to delegate the responsibility to a parent element that listens for clicks on child elements:

 

$('#wrapper').on('click', 'a', function() {
    // Handle here
});
Now even if the content of #wrapper changes, the handler still exists and intercepts any click events on anchors as they bubble up the document.
Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.