Je connais des appels à $ (fonction () {}) dans JQuery sont exécutés dans l'ordre qu'ils sont définis, mais je me demande si vous pouvez contrôler l'ordre de la file d'attente?
Par exemple, est-ce Possible d'appeler "Hello World 2" avant "Hello World 1": P>
$(function(){ alert('Hello World 1') });
$(function(){ alert('Hello World 2') });
4 Réponses :
Ces fonctions sont ajoutées à un tableau privé http://github.com/jquery/jquery /blob/master/src/core.js#l47 lisyliste , donc je dirais que ce n'est pas accessible pour la manipulation.
Cela peut être fait, mais pas facilement. Vous devriez pirater jquery lui-même, probablement ici . Avant que JQuery ne commence à appeler ces fonctions à l'intérieur de la boucle tandis que , vous devez ajouter du code pour inspecter le tableau rédayyliste
Voici comment vous alliez le faire:
// lower priority value means function should be called first
var method_queue = new Array();
method_queue.push({
method : function()
{
alert('Hello World 1');
},
priority : 2
});
method_queue.push({
method : function()
{
alert('Hello World 2');
},
priority : 1
});
function sort_queue(a, b)
{
if( a.priority < b.priority ) return -1;
else if( a.priority == b.priority ) return 0;
else return 1;
}
function execute_queue()
{
method_queue.sort( sort_queue );
for( var i in method_queue ) method_queue[i].call( null );
}
// now all you have to do is
execute_queue();
Vous pouvez utiliser JQuery Promette pour réaliser quelque chose comme ça.
Suivant est un exemple où jQuery.ready.Promise aide à gérer l'ordre d'exécution des blocs de prêt DOM: p>
Dans l'exemple suivant, le premier bloc Dom Ready tente d'accéder à la hauteur du test DIV qui est annexé au corps dans un bloc de prêt DOM ultérieur. Comme dans le violon omet de l'obtenir. P>
jQuery(function () {
jQuery.ready.promise().done(function () {
var testDivHeight = jQuery("#test-div").outerHeight();
if(testDivHeight) {
alert("Height of test div is: "+testDivHeight);
} else {
alert("Sorry I cannot get the height of test div!");
}
});
});
jQuery(function () {
jQuery('body').append('<div style="background: #C00; height: 100px;" id="test-div"></div>');
});
Dans l'exemple suivant, il fait exactement la même chose que l'exemple avant d'utiliser jQuery.ready.Promise. Comme dans le violon, cela fonctionne comme requis. P>
jQuery(function () {
var testDivHeight = jQuery("#test-div").outerHeight();
if(testDivHeight) {
alert("Height of test div is: "+testDivHeight);
} else {
alert("Sorry I cannot get the height of test div!");
}
});
jQuery(function () {
jQuery('body').append('<div style="background: #C00; height: 100px;" id="test-div"></div>');
});
Pourquoi définiriez-vous 2 $ de blocs de 2 $ (Fonction () {} blocks? J'utiliserais simplement 1 et mettre des choses de pointe par ordre d'exécution.
@Gregg: Considérez une situation dans laquelle vous utilisez un outil tiers sur votre site qui utilise JQuery et Document.Ready. Considérez en outre que vous souhaitiez peut-être ajouter du code à votre page qui s'appuie sur le document tiers.Ready étant exécuté d'abord avant la vôtre. Ce n'est pas toujours facile à contrôler ou à prédire l'ordre de fonctionnement.