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.

Answer 1

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?