I am trying to create a small, simple JS framework for education purposes, but now I've got a problem I'm unable to solve.
Directory structure
/
/framework
jquery.js
init.js
/content
home.html
style.css
index.html
The problem
I'm obviously not pasting the jQuery file and stylesheet here, but here are index.html and init.js:
index.html
<!DOCTYPE html>
<head>
<script src="framework/jquery-1.5.min.js"></script>
<script src="framework/init.js"></script>
<title>My website</title>
</head>
<body>
<div id="content">
</div>
</body>
</html>
init.js
$(document).ready(function(){
if(!window.location.hash) {
$("#content").load("../content/home.html", function() {
alert("Load was perf开发者_如何学编程ormed.");
});
}
});
The home.html file contains some sample text, nothing special. I expect jQuery to load the contents of home.html into the content div, but nothing happens when I load the page. The alert with the message "Load was performed" is fired, however.
This task seems quite trivial to me so the mistake I made is probably quite silly, but any help is nevertheless very much appreciated.
Thank you!
Update:
It works when I use this on my server, but in localhost it fails. I can't use the Firebug trick now, because it shows nothing when I use it locally.. Any ideas?
The load function is broken in jquery 1.5 release. You can find the bug ticket at http://bugs.jquery.com/ticket/8125. This is fixed in version 1.5.1 which is not yet released to google and microsoft cdn. You can find the very latest jquery release with all the latest fixes including load() at http://code.jquery.com/jquery-git.js
I tested and confirmed that your code works in 1.5.1
If you're using Firebug, open the NET tab. It allows you to see the ajax response.
Chances are you should be using: /content/home.html
, not ../content/home.html
The path is in context to the page, not where the JS file resides.
The base location for the executing script is the location of index.html, so the relative path to home.html is "content/home.html"
, and not "../content/home.html"
.
just try it with ./
$(document).ready(function(){
if(!window.location.hash) {
$("#content").load("./content/home.html", function() {
alert("Load was performed.");
});
}
});
that is working for me at least.
精彩评论