How to disable user's input while loading page with jQuery?

Question

I have a heavy-jquerized page with some links, various user inputs and such.

I use jquery, with actions defined in a

$(document).ready( function() {
  ....
} );

block.

But while the page is loading (or, even worse - reloading), and a user clicks a link, the href action from it is triggered, as the javascript isn't loaded / active yet.

I wanted to block it somehow. One way that came to my mind is to put a transparent div over whole document, that would receive the click events instead of the layer below it. Then, in my .ready function in javascript, I could hide that div making it possible to use the page.

Is it a good practice? Or should I try some different approach?

Answer 1

Another option is to use the jQuery BlockUI plugin (which probably usew the same or similar idea behind the scenes).