javascript document ready function
Question
And once again I am stuck in the learning process. I am trying to animate a background of a site using the help provided here . But I am a little stuck. As I am teaching myself javascript (to replace basic actionscript). I like to write line by line instead of copying an pasting so I can understand how things work.
This is what I have so far:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My Site</title>
<script type="text/javascript">
$(document).ready(function(){
window.alert("function started");
});
</script>
</head>
<body>
</body>
</html>
As you can see the alert window should pop up as the function is started, but it doesn't. Is there a reason why this happens or should I just set up a body onLoad function to handle what I want to do when the page loads?
3 answers
solution1
3 ACCPTED 2013-10-24 21:38:46
You forgot to include the jQuery javascript API in your page. It should be included before you use the $() function (which is an alias for the jQuery() function in this case.)
If you check your browser's Javascript console you probably have an exception for trying to use undefined $ . (In IE a handy trick while doing web development is to enable the Advanced option for "Display a notification for every script error," but this can get annoying when visiting other sites because lots of developers are lousy about identifying and fixing unhandled JS exceptions! Modern browsers usually use 'F12' (in the US at least), to open the developer tools for debugging Javascript, etc.)
Corrected code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My Site</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function ()
{
window.alert("function started");
});
</script>
</head>
<body>
</body>
</html>
This example uses the Google-hosted jQuery API, but you may also choose to download jQuery from http://jquery.com
solution2
0 2013-10-24 21:38:38
Demo
You are missing library reference~! like this
<script type='text/javascript' src='//code.jquery.com/jquery-2.0.2.js'></script>
Hope rest feeds your needs :)
Basics: http://jqfundamentals.com/chapter/jquery-basics
JQ CDN: http://jquery.com/download/
$(document).ready(function(){
window.alert("function started");
});
solution3
0 2013-10-24 21:40:06
You are not first loading jQuery. jQuery is a library that you are trying to call by using the $. You can download it here: http://jquery.com/download/ . Make sure you load jQuery before the javascript code.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.