Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

$(document).ready(function() is not working

Tags:

I am using Jquery for getting a json object from a solr server. When I run my html file with Tomcat it is runns fine but when I embed it with my project which is running on weblogic it gets this error: (debugging done through firebug)

$ is not defined $(document).ready(function(){   

Why do I get this error when I embed it in my project?

This is the contents of my <head> tag, It is how I include jquery.js:

<head>   <title>Search Result  </title>   <style>     img{ height: 150px; float: left; border: 3;}     div{font-size:10pt; margin-right:150px;     margin-left:150px; }   </style>    <script type="text/javascript" src="jquery-1.6.1.js"></script>   <script type="text/javascript">     $(document).ready(function(){       //Error happens here, $ is not defined.      });   </script> </head> 
like image 242
Romi Avatar asked Jun 14 '11 08:06

Romi


People also ask

Is not a function $( document .ready function ()?

ready is not a function" error occurs for multiple reasons: Placing second set of parenthesis after the call to the ready() method. Loading the jQuery library after running your JavaScript code. Forgetting to load the jQuery library.

What does $( document .ready function () do?

$( document ). ready()A page can't be manipulated safely until the document is "ready." jQuery detects this state of readiness for you. Code included inside $( document ). ready() will only run once the page Document Object Model (DOM) is ready for JavaScript code to execute.

How do you call a function after document ready?

So, there is no event called after document. ready(). You'll need to create and wait for events to complete on your own, or use window. load().

What is $( document .ready () and $( window .load () in jQuery which one will be fired first?

The key difference between $(document). ready() and $(window). load() event is that the code included inside onload function will run once the entire page(images, iframes, stylesheets,etc) are loaded whereas the $(document). ready() event fires before all images,iframes etc.


2 Answers

Did you load jQuery in head section? Did you load it correctly?

<head>    <script src="scripts/jquery.js"></script>    ... </head> 

This code assumes jquery.js is in scripts directory. (You can change file name if you like)

You can also use jQuery as hosted by Google:

<head>    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>    ... </head> 

As per your comment:

Apparently, your web server is not configured to return jQuery-1.6.1.js on requesting /webProject/jquery-1.6.1.js. There may be numerous reasons for this, such as wrong file name, folder name, routing settings, etc. You need to create another question and describe your 404 in greater details (such as local file name, operation system, webserver name and settings).

Again, you can use jQuery as provided by Google (see above), however you still might want to find out why some local files don't get served on request.

like image 148
Dan Abramov Avatar answered Sep 23 '22 18:09

Dan Abramov


I found we need to use noConflict sometimes:

jQuery.noConflict()(function ($) { // this was missing for me     $(document).ready(function() {          other code here....      }); }); 

From the docs:

Many JavaScript libraries use $ as a function or variable name, just as jQuery does. In jQuery's case, $ is just an alias for jQuery, so all functionality is available without using $. If you need to use another JavaScript library alongside jQuery, return control of $ back to the other library with a call to $.noConflict(). Old references of $ are saved during jQuery initialization; noConflict() simply restores them.

like image 23
abilash kumar Avatar answered Sep 22 '22 18:09

abilash kumar