jQuery wrapper function when using Drupal behaviours

Question

I have been trying unsuccessfully to add Drupal behaviors to an existing and workding JS script file that is wrapped in :

jQuery(document).ready(function($){
  // some JS here
  Drupal.behaviors.ios = {
    attach: function (context, settings) {

        // Code to be run on page load, and
        // on ajax load added here

    }
  };
});

I cannot get my behaviours to work.

However I have changed the wrapper to :

(function($){
  // some JS here
  Drupal.behaviors.ios = {
    attach: function (context, settings) {

        // Code to be run on page load, and
        // on ajax load added here

    }
  };
})(jQuery);

and now the behaviours work.

What is the difference between the wrappers and can I expect the existing Javascript to continue functioning if I make this change ?

Answer 1

Drupal attaches behaviours on DOM ready - by waiting until the DOM is ready yourself to actually inform Drupal of your custom behaviour, it's too late (unless you call Drupal.attachBehaviors manually afterwards, which would be less than efficient).

Your 2nd example is both logically correct, and the recommended way to use behaviours with jquery in Drupal 7.

Unless you have a very good reason not to, always using that approach would be a good idea.