Contents:
Description: Specify a function to execute when the DOM is fully loaded.
function(jQuery) A function to execute after the DOM is ready. Receives jQuery as argument.
The function passed to jQuery.ready() is guaranteed to be executed after the DOM is ready,
so this is usually the best place to attach all other event handlers and run other jQuery code.
<body>
<p></p>
</body>jQuery.ready(function($){
$("p").text("The DOM is now loaded and can be manipulated.");
});<body>
<p>The DOM is now loaded and can be manipulated.</p>
</body>Description: Specify a function to execute when required plugins are fully loaded.
plugins A plugin name or an array of plugin names.
function(jQuery) A handler to execute after all required plugins are ready. Receives jQuery as argument.
options A set of type/name(s) pairs that define requirements for the ready call.
function(jQuery) A handler to execute after all required dependencies are ready. Receives jQuery as argument.
The jQuery.ready() is a method to bind dependencies for a method.
You want to execute some code which requires plugins, plugin extensions or oder scripts?
Use the jQuery.ready(), it will check the availability of these rather load these.
If all dependencies are available then your code will execute.
The received argument is jQuery, it is very useful if jQuery are running in noConflict mode.
So you can use the $ alias inside your handler.
All plugins are located in the script directory and dots in plugin names represent subdirectories.
<div>
<ul class="list">
</ul>
</div>jQuery.ready( 'jQuery.tmpl', function($){
var tmpl = $.tmpl( '<li>${name}</li>', [
{name:'list entry 1'},
{name:'list entry 2'},
{name:'list entry 3'},
{name:'list entry 4'}
]);
// wait for DOM ready
$.ready(function(){
$('ul.list').append(tmpl);
});
});<div>
<ul class="list">
<li>list entry 1</li>
<li>list entry 2</li>
<li>list entry 3</li>
<li>list entry 4</li>
</ul>
</div><div>
<ul class="list">
</ul>
</div>jQuery.ready( ['jQuery.tmpl', 'jQuery.json'], function($){
var data = [
{name:'list entry 1'},
{name:'list entry 2'},
{name:'list entry 3'},
{name:'list entry 4'}
],
tmpl = $.tmpl( '<li>${name}</li>', data ),
json = $('<span>).text( $.toJSON(data) );
// wait for DOM ready
$.ready(function(){
$('ul.list')
.append(tmpl)
.before( json );
});
});<div>
<span>[{"name":"list entry 1"},{"name":"list entry 2"},{"name":"list entry 3"},{"name":"list entry 4"}]</span>
<ul class="list">
<li>list entry 1</li>
<li>list entry 2</li>
<li>list entry 3</li>
<li>list entry 4</li>
</ul>
</div><div>
<ul class="list">
</ul>
</div>jQuery.ready({
plugin: [ 'jQuery.tmpl', 'jQuery.json' ], // wait for plugins
DOM: true // wait for DOM ready
}, function($){
var data = [
{name:'list entry 1'},
{name:'list entry 2'},
{name:'list entry 3'},
{name:'list entry 4'}
],
tmpl = $.tmpl( '<li>${name}</li>', data ),
json = $('<span>).text( $.toJSON(data) );
$('ul.list')
.append(tmpl)
.before( json );
});<div>
<span>[{"name":"list entry 1"},{"name":"list entry 2"},{"name":"list entry 3"},{"name":"list entry 4"}]</span>
<ul class="list">
<li>list entry 1</li>
<li>list entry 2</li>
<li>list entry 3</li>
<li>list entry 4</li>
</ul>
</div><div>
<ul class="list">
</ul>
</div>jQuery.ready({
plugin: [ 'jQuery.tmpl', 'jQuery.json' ], // wait for plugins
script: 'provide-foo', // wait for script
DOM: true // wait for DOM ready
}, function($){
var tmpl = $.tmpl( '<li>${name}</li>', data ),
json = $('<span>).text( $.toJSON(window.fooData) );
$('ul.list')
.append(tmpl)
.before( json );
});jQuery.provide( 'provide-foo', function($){
window.fooData = [
{name:'list entry 1'},
{name:'list entry 2'},
{name:'list entry 3'},
{name:'list entry 4'}
];
});<div>
<span>[{"name":"list entry 1"},{"name":"list entry 2"},{"name":"list entry 3"},{"name":"list entry 4"}]</span>
<ul class="list">
<li>list entry 1</li>
<li>list entry 2</li>
<li>list entry 3</li>
<li>list entry 4</li>
</ul>
</div>Description: Specify a function to execute when required plugins are fully loaded.
Plugin: jQuery.dict
options A set of type/name(s) pairs that define requirements for the ready call.
function(jQuery) A handler to execute after all required dependencies are ready. Receives jQuery as argument.
The jQuery.dict plugin extends the dependencies controller. So it is possible to load dictionaries automatical with Ajax.
All dictionaries are JSON files located in the script directory and dots in dictionary names represent subdirectories. To specify the region, set the region before the dictionary name with colon separation, if no region specified the default region will be used.
jQuery.ready({
plugin: ['jQuery.tmpl'], // required plugins
dict: ['de-DE:proj.example', 'en-US:proj.example'] // specify required dictionaries
}, function($){
// using the dictionaries
var dictDE = $.dict('de-DE:proj.example'),
dictEN = $.dict('en-US:proj.example');
dictDE.translate('Cancel') // Abbrechen
dictEN.translate('Cancel') // Cancel
});Description: Specify a function to execute when required plugins are fully loaded.
Plugin: jQuery.i18n
options A set of type/name(s) pairs that define requirements for the ready call.
function(jQuery) A handler to execute after all required dependencies are ready. Receives jQuery as argument.
The jQuery.i18n plugin extends the dependencies controller. So it is possible to load internationalisation regions and
currencies automatical with Ajax.
All region and currency are Javascript files located in the script/jQuery/i18n directory.
Each region is given a unique code that is a combination of an ISO 639 two-letter lowercase culture code for the language and a two-letter uppercase code for the country or region. There are exceptions for some regions, such as Latin and Cyril variant.
Each currency is given a unique code of an ISO 4217 three-letter uppercase code.
jQuery.ready({
plugin: ['jQuery.i18n'], // required plugins
i18n: ['de-DE', 'USD'] // specify required i18n definitions
}, function($){
// using the dictionaries
$.i18n( "d", "15.02.2011", {region:"de-DE"} );
// results: date object => Tue Feb 15 2011 00:00:00 GMT+0100 (CET)
$.i18n( "c", 1325.25, {region:"de-DE"} );
// results: 1.325,25 Û
$.i18n( "c", 1325.25, {region:"de-DE", currency: 'USD'} );
// results: 1.325,25 $
$.i18n( "c", 1325.25, {region:"en", currency: 'USD'} );
// results: $1,325.25
});Description: Specify a function to execute when required plugins are fully loaded.
Plugin: jQuery.tmpl
options A set of type/name(s) pairs that define requirements for the ready call.
function(jQuery) A handler to execute after all required dependencies are ready. Receives jQuery as argument.
The jQuery.tmpl plugin extends the dependencies controller. So it is possible to load templates automatical with Ajax.
All templates are HTML files located in the script directory and dots in dictionary names represent subdirectories.