Pouvez-vous avoir plusieurs $ (document) .ready (function () {…}); sections?

Si j’ai beaucoup de fonctions au démarrage, doivent-elles toutes être sous un seul:

$(document).ready(function() { 

ou puis-je avoir plusieurs de ces déclarations?

Vous pouvez en avoir plusieurs, mais ce n’est pas toujours la meilleure chose à faire. Essayez de ne pas en abuser, car cela affectera sérieusement la lisibilité. A part ça, c’est parfaitement légal. Voir ci-dessous:

http://www.learningjquery.com/2006/09/multiple-document-ready

Essayez ceci:

 $(document).ready(function() { alert('Hello Tom!'); }); $(document).ready(function() { alert('Hello Jeff!'); }); $(document).ready(function() { alert('Hello Dexter!'); }); 

Vous constaterez que cela équivaut à ceci, notez l’ordre d’exécution:

 $(document).ready(function() { alert('Hello Tom!'); alert('Hello Jeff!'); alert('Hello Dexter!'); }); 

Il convient également de noter qu’une fonction définie dans un bloc $(document).ready ne peut pas être appelée à partir d’un autre bloc $(document).ready , je viens d’exécuter ce test:

 $(document).ready(function() { alert('hello1'); function saySomething() { alert('something'); } saySomething(); }); $(document).ready(function() { alert('hello2'); saySomething(); }); 

sortie était:

 hello1 something hello2 

Vous pouvez utiliser plusieurs. Mais vous pouvez également utiliser plusieurs fonctions dans un même document.

 $(document).ready(function() { // Jquery $('.hide').hide(); $('.test').each(function() { $(this).fadeIn(); }); // Reqular JS function test(word) { alert(word); } test('hello!'); }); 

Oui, vous pouvez facilement avoir plusieurs blocs. Faites juste attention aux dépendances entre elles car l’ordre d’évaluation peut ne pas correspondre à vos attentes.

Oui, il est possible d’avoir plusieurs appels $ (document) .ready (). Cependant, je ne pense pas que vous puissiez savoir de quelle manière ils seront exécutés. (la source)

Oui c’est possible mais vous pouvez mieux utiliser un div #mydiv et utiliser les deux

 $(document).ready(function(){}); //and $("#mydiv").ready(function(){}); 

Oui, tout va bien, mais évitez de le faire sans raison. Par exemple, je l’ai utilisé pour déclarer des règles de site globales séparément des pages individuelles lorsque mes fichiers javascript ont été générés dynamicment, mais si vous continuez à le faire, il sera difficile à lire.

En outre, vous ne pouvez pas accéder à certaines méthodes à partir d’un autre jQuery(function(){}); Appelez donc c’est une autre raison pour laquelle vous ne voulez pas faire ça.

Avec l’ancienne window.onload vous devez remplacer l’ancienne chaque fois que vous avez spécifié une fonction.

Oui, vous pouvez.

Plusieurs sections prêtes pour le document sont particulièrement utiles si d’autres modules se trouvent sur la même page. Avec l’ancienne déclaration window.onload=func , chaque fois que vous window.onload=func une fonction à appeler, elle remplaçait l’ancienne.

Maintenant, toutes les fonctions spécifiées sont mises en queue / empilées (quelqu’un peut-il confirmer?) Quelle que soit la section de document dans laquelle elles sont spécifiées.

Je pense que la meilleure façon de faire est de passer à des fonctions nommées (vérifiez ce débordement pour en savoir plus sur ce sujet) . De cette façon, vous pouvez les appeler depuis un seul événement.

Ainsi:

 function firstFunction() { console.log("first"); } function secondFunction() { console.log("second"); } function thirdFunction() { console.log("third"); } 

De cette façon, vous pouvez les charger dans une seule fonction prête.

 jQuery(document).on('ready', function(){ firstFunction(); secondFunction(); thirdFunction(); 

})

Cela affichera les informations suivantes sur votre console.log:

 first second third 

De cette façon, vous pouvez réutiliser les fonctions pour d’autres événements.

 jQuery(window).on('resize',function(){ secondFunction(); }); 

Vérifiez ce violon pour la version de travail

C’est légal, mais parfois, cela provoque un comportement indésirable. En guise d’exemple, j’ai utilisé la bibliothèque MagicSuggest et ajouté deux entrées MagicSuggest dans une page de mon projet et utilisé des fonctions de préparation de document distinctes pour chaque initialisation des entrées. La toute première initialisation des entrées a fonctionné, mais pas la seconde et aucune erreur, la deuxième entrée n’apparaissait pas. Je recommande donc toujours d’utiliser une fonction Document Ready.

Vous pouvez même imbriquer des fonctions de document dans des fichiers HTML inclus. Voici un exemple d’utilisation de jquery:

Fichier: test_main.html

       

test_main.html

Fichier: test_embed.html

 

test_embed.html

Sortie de la console:

 test_main.html READY test_main.html:15 test_embed.html READY (program):4 

Le navigateur affiche:

test_embed.html

Vous pouvez également le faire de la manière suivante:

       

This is a test of jQuery!

This is a hidden paragraph.