jQuery : Error: $(document).ready is not a function

July 25, 2009 5:50 am Published by 6 Comments

Yes it bloody is!

Quite often when I’m mucking about with WordPress firebug will throw the following error:

jQuery : Error: $(document).ready is not a function

If you see this error it’s because another framework is in conflict with jQuery – most usually in my case it’s mootools or scriptaculous, anyway here’s the work-around.

The people who developed jQuery had the foresight to include a function which makes jQuery play nicely with other frameworks which all use the $ sign as a staple part of their code. Introducing the jQuery.noConflict(); function.

The jQuery.noConflict(); command you can replace the $ sign with the word jQuery throughout your code.

So, for example, instead of using the normal dom ready function: $(document).ready(function() you would use: jQuery(document).ready(function() just don’t forget to call the .noConflict function before this, so the whole shebang would look like this:

<script src=”mootools.js”></script> // this is the conflicting framework
<script src=”jquery.min.js”></script> // this is your jQuery
<script>
jQuery.noConflict(); // start substituting $ for jQuery
jQuery(document).ready(function(){
jQuery.yourjQueryfunctions();
});
</script>

instead of:

<script src=”mootools.js”></script>
<script src=”jquery.min.js”></script>
<script>
$(document).ready(function(){
$.yourjQueryfunctions();
});
</script>

  1. <script src=“prototype.js”></script>
  2. <script src=“jquery.js”></script>
  3. <script>
  4. jQuery.noConflict();
  5. jQuery(document).ready(function(){
  6. jQuery(‘div’).stuff();
  7. //notice, that the $sign has been replaced with the word jQuery
  8. });
  9. // And you can use Prototype with $(…)
  10. $(‘id’).hide();
  11. </script>
Tags:

Categorised in:

This post was written by WillyNilly

6 Comments

Leave a Reply

Your email address will not be published. Required fields are marked *