How do I load specific content ID according to referrer URL using .load()

Question

Here an example of my code, which when user click a link then it will load a specific content id and will show default content if there have no click action into #content div

$(document).ready(function () {
    $.ajaxSetup({
        cache: false
    });
    $("a.view").live('click', function (e) {
        var id = $(this).data("id");
        $('#content').load("content.php?" + id);
        e.preventDefault();
    });
    $('#content').load("content.php");
});

Question, how to load a content automatically when user using direct link or type in url bar : example http://domain.com/content.php?id=5

So if user type or using direct link I want script doing exactly like .live('click') and load the current id example is 5

Let me know.

Here's how to get the `GET`-parameters with JavaScript: http://stackoverflow.com/questions/1403888/get-url-parameter-with-jquery - You could check them on load if they are set and then decide what to do. Maybe you could outsource the click-function to a named function which takes one parameter and then call it either when a GET-parameter is set or on click. — Quasdunk, Jan 13 '12 at 13:25
Have you tried naming the id parameter in your query string? `$('#content').load("content.php?id=" + id);` — jrummell, Jan 13 '12 at 13:28

score 2 · Accepted Answer · edited May 23 '17 at 10:34

Using your example, you'll need an anchor to bind to:

<a href="#" data-id="5" class="view">Some Link</a>

Then the code should work as follows:

$(function(){
  // bind to current and future anchors with the "view" class applied
  $('a.view').live('click',function(){
    // grab the content and load it in to the container
    $('#container').load('content.php?id=' + $(this).data('id'));
    // return false so it doesn't follow the link
    return false;
  });

  // also load the default content (before any click event)
  $('#container').load('defaultContent.php');
});

However, if you're looking for a seamless (and SEO acceptable) content page, I would look in to using the hashbang syntax: What's the shebang/hashbang (#!) in Facebook and new Twitter URLs for?

How do I load specific content ID according to referrer URL using .load()

1 Answers1