What are the side effects (if any) of multiple $(document).ready() in an HTML page?

Question

I am using a web application framework (Symfony 1.3.6), which follows the MVC pattern.

The view layer is comprised of a template decorator. The template file may also in

Answer 1

There are no problems with multiple $(document).ready() calls, only a couple of caveats:

• Reduced readability.
• Scope: a function/variable/object declared inside one $(document).ready() will not be visible in any others. See this simple demo.

Also see this previous question on SO:

• Can you have multiple $(document).ready(function(){ ... }); sections?

Answer 2

You can indeed use as many instances of $(document).ready() on a page as you like. You can group your blocks of initialization code in whichever way makes the most sense for your application. What you gain in flexibility you may lose a bit in clarity, though, since it's no longer as easy to see what happens when onLoad fires.

References: jQuery Tutorial on Multiple $(document).ready()

Answer 3

If you want to reuse js code snippets on different pages, you can use the view.yml config file in each of your modules like this:

firstActionSuccess:
  javascripts: [js1.js, js2.js]
secondActionError:
  javascripts: [js1.js, js3.js]