I've spent a while going through numerous similar questions, but based on the answers given, I'm lead to believe I have this setup correctly - but it's not working, and I'm not sure why.

I'm a newbie with Javascript/jQuery, so it's very possible (or probable!) that I'm missing something pletely obvious here.

I have a page with a large 'main' div, and I'm loading content into that using jQuery .load via the navigation. That all works fine. However, some of the target pages are data-heavy, so I'm trying to integrate something in between to indicate to the user that the page is loading. Because there are numerous navigation elements, rather than having multiple functions (i.e one for each navigation element) I'm trying to do it in a single function, like so...

<script type="text/javascript">
function loadPage(pgurl) {
    $('#main').html('<p align="center">Loading...</p>');
    $('#main').load(' +pgurl+ ');
}
</script>

The problem I have is the onclick within the navigation. Prior to this, I had the .load within the onclick (i.e onclick="$('#main').load('/pages/testpage/');") and that worked fine. Now I'm firing the loadPage function via onclick, it's loading a black page (which firebug tells me is the site root).

Here's my onclick code;

<a onclick="loadPage('/pages/testpage/');return false;">Test</a>

I get no errors returned. I can only assume that the loadPage function is getting a zero value, rather than /pages/testpage/ - but I have no idea why!

Pointers much appreciated - much head scratching going on here!

I've spent a while going through numerous similar questions, but based on the answers given, I'm lead to believe I have this setup correctly - but it's not working, and I'm not sure why.

I'm a newbie with Javascript/jQuery, so it's very possible (or probable!) that I'm missing something pletely obvious here.

I have a page with a large 'main' div, and I'm loading content into that using jQuery .load via the navigation. That all works fine. However, some of the target pages are data-heavy, so I'm trying to integrate something in between to indicate to the user that the page is loading. Because there are numerous navigation elements, rather than having multiple functions (i.e one for each navigation element) I'm trying to do it in a single function, like so...

<script type="text/javascript">
function loadPage(pgurl) {
    $('#main').html('<p align="center">Loading...</p>');
    $('#main').load(' +pgurl+ ');
}
</script>

The problem I have is the onclick within the navigation. Prior to this, I had the .load within the onclick (i.e onclick="$('#main').load('/pages/testpage/');") and that worked fine. Now I'm firing the loadPage function via onclick, it's loading a black page (which firebug tells me is the site root).

Here's my onclick code;

<a onclick="loadPage('/pages/testpage/');return false;">Test</a>

I get no errors returned. I can only assume that the loadPage function is getting a zero value, rather than /pages/testpage/ - but I have no idea why!

Pointers much appreciated - much head scratching going on here!

• javascript
• jquery

Share Improve this question Follow edited Jan 10, 2013 at 18:01 Danilo Valente 11.4k88 gold badges5454 silver badges7070 bronze badges asked Jan 10, 2013 at 17:59 LeeLee 99933 gold badges1414 silver badges3030 bronze badges 1

• 1 $('#main').load(' +pgurl+ '); should be $('#main').load(pgurl); – Pointy Commented Jan 10, 2013 at 18:01

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 3

It's already a string:

$('#main').load(pgurl);

$('#main').load(' +pgurl+ ');

needs to be

$('#main').load(pgurl);

You should probably write it as one line to prevent the second look up.

function loadPage (pgurl) {
    $('#main').html('<p align="center">Loading...</p>').load(pgurl);
}

Is that a typo? Try changing:

$('#main').load(' +pgurl+ ');

to

$('#main').load(pgurl);

Because it seem you're not using the pgurl parameter, this thing in the load brackets is string a text of the variable name :)

$('#main').load(' +pgurl+ ');

use that instead

$('#main').load(pgurl);

Maybe you should look at that if you're not familiar with string concatenation http://www.youtube./watch?v=n17aX2TdQRk

You have to change following line // you pass string not a variable //

$('#main').load(' +pgurl+ ');

to

$('#main').load(pgurl);