Question

Most of the jquery deep linking plugins I have seen required me to attach ‘#’ to my links. This is an example:

<a href="#page1.html">Page 1</a>

Even twitter does this (however, twitter follows the Google specification for crawlable links using #!, which is also supported by jquery deep linking libraries like Jquery BBQ and Jquery Address).

I turned off Javascript with the new twitter and it does not work. I’m asking this question to know if I can apply deep linking and still have a functional site even with Javascript off.

Thanks in advance!

Answer 1

No – if you want to deep link using AJAX, you’re going to have to make it work this way. The anchor is the only part of the URL that can be updated without the page reloading. It isn’t generally sent to the server either so it’s always handled by the browser.

One thing you could do is have the actual link in the a tag, then use jQuery to update the link:

<a href="page1.html" class="ajaxLoad">Page 1</a>

<script>
$(function(){
  $("a.ajaxLoad").each(function(){ this.href = '#' + this.href })
});
</script>

With JavaScript turned off, this will redirect the user to ‘page1.html’ when they click the link. Otherwise, the link is changed to an anchor one and you should be able to pick it up with your deep linking code. The benefit of something like this is that non-JavaScript browsers will be able to use the links correctly (and this includes search engine spiders).

---

Edit: Just so you know, there’s a few things you can do rather than use JavaScript to change it. For example, you could attach to the click handler of the links and use load or something to change the area you want to load your page.

$("a.ajaxLoad").click(function(e){
    e.preventDefault();
    $("#content").load(this.href + ' #content');
});