Question

I have this function:

<script type='text/javascript'>
$('#clicktogohome').live('click', function(){
  history.pushState({}, '', this.href);
  popstate(this.href);
  return false;
});
$('#listentosong').live('click', function(){
  history.pushState({}, '', this.href);
  popstate(this.href);
  return false;
});

popstate = function(url){
  url = '/ajaxlinks/'+window.location.pathname.substr(1);
  if (url == '/ajaxlinks/'){url =  '/ajaxlinks/index.php'}
  $('#ajaxloadcontent').load(url+"#ajaxloadcontent > *");
}

window.onpopstate = function(event){
  popstate(window.location.href);
  event.preventDefault();
}
</script>

This function is very important to my website and works perfectly, when I do not add this line:

if (url == '/ajaxlinks/'){url =  '/ajaxlinks/index.php'}

After adding this line, the new URL updates, and the back and froward button still work, however, it seems as if this line does not work and update the div on my page:

$('#ajaxloadcontent').load(url+"#ajaxloadcontent > *");

Is this common in jQuery and does anyone know how I can fix it. The function works without setting the variable “url,” but it must be done for my usage of the function. Does anyone know how to fix this? Thanks!

Answer 1

The problem is the lack of a space between the url variable and the string. It should, I think, be:

$('#ajaxloadcontent').load(url+" #ajaxloadcontent > *");

It’s an incorrect use of load() which expects a URL and a selector to be found in the page found at that URL.

I’d also question why you’re using the > * selector; since using only #ajaxloadcontent will retrieve the element itself (including its descendant elements).

Further to the comment left to this question:

That still does not work for me. If you want to see the problem that I am having, go here pearlsquirrel.com/listen.php?u=101 and click on the PearlSquirrel logo. The URL updates and yet the content does not load. This still occurs with the code above.

It’s important to note that the JavaScript console reports:

GET http://www.pearlsquirrel.com/ajaxlinks/index.php 404 (Not Found)

Not to mention reference errors:

http://www.pearlsquirrel.com/:53Uncaught SyntaxError: Unexpected identifier
http://www.pearlsquirrel.com/:365Uncaught SyntaxError: Unexpected end of input

Reference:

• load().