Question

I am trying to get this functionality going but am a bit uncertain and don’t know how to approach it. I have a master page with a div called “masterDiv”. ‘masterDiv’ makes a load() call and loads content of an external html page called “details.html” from it content div. This is how I am doing it:

  $('#masterDiv').load('details.html #content');

content loads up as expected and the url address pops in as “http://www.xyz.com#details”

This is all good and working, but then I thought of those users who may not have JavaScript endabled. I figure I would just direct those users to ‘details.html’ page directly instead of having the “Master Page” load the content from “details.html” page. So now here is the issue, lets say if I send a user this link:

    http://wwww.xyz.com#details

And if that user’s browser doesn’t have Javascript enabled then obviously JQuery cannot be invoked and therefore load() call will not be made and so on. how can I direct the user to “details.html” page directly, please?

Any insight would be wonderful

Thank you.

Answer 1

Your link probably looks like this :

<a id="myLink" href="#details">Link that the user clicks</a>

When the user clicks the link, jQuery load is called. Is that correct?

If so, you could instead have your link like this :

<a id="myLink" href="http://wwww.xyz.com/details.html">Link that the user clicks</a>

That way, when the page loads, the link will work for everyone (even those with javascript disabled). Then, when the page first loads :

$(document).ready(function() {
    $('#myLink').attr('href', '#details');
});

will set the link to the way it was before. That way, only users with Javascript enabled will use the load version. The other ones will simply be redirected to details.html

If there is something I haven’t understood correctly in the question let me know.