jQuery 多文档就绪队列顺序

Question

我知道 jQuery 中对 $(function(){ }) 的调用是按照定义的顺序执行的，但我想知道您是否可以控制队列的顺序？

例如，是否可以在“Hello World 1”之前调用“Hello World 2”：

$(function(){ alert('Hello World 1') });
$(function(){ alert('Hello World 2') });

问题是是否可能......我已经知道这违背了最佳实践；）

Answer 1

以下是您的操作方法：

// 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();

您可以阅读更多相关信息 这里

Answer 2

这些函数被添加到私有数组 readyList 中，因此我认为它无法进行操作。

http://github.com/jquery/jquery/blob/ master/src/core.js#L47

Answer 3

你可以使用 jQuery Promise 来实现这样的事情。

以下是 jQuery.ready.promise 帮助管理 DOM Ready 块的执行顺序的示例：

1. 在以下示例中，第一个 DOM Ready 块尝试访问附加到主体的测试 div 的高度在稍后的 DOM Ready 块中。就像在小提琴中一样，它无法获取它。

   jQuery(function () {
       var testDivHeight = jQuery("#test-div").outerHeight();
       如果（测试DivHeight）{
           alert("测试div的高度为："+testDivHeight);
       } 别的 {
           Alert("抱歉，我无法获取测试 div 的高度！");
       }
   });
   jQuery(函数 () {
       jQuery('body').append('
   ');
   });
   

   小提琴：http://jsfiddle.net/geektantra/qSHec/

2. 在以下示例中，它与使用 jQuery.ready.promise 之前的示例完全相同。就像在 Fiddle 中一样，它按要求工作。

   jQuery(function () {
       jQuery.ready.promise().done(function () {
           var testDivHeight = jQuery("#test-div").outerHeight();
           如果（测试DivHeight）{
               alert("测试div的高度为："+testDivHeight);
           } 别的 {
               Alert("抱歉，我无法获取测试 div 的高度！");
           }
       });
   });
   jQuery(函数 () {
       jQuery('body').append('
   ');
   });
   

   小提琴：http://jsfiddle.net/geektantra/48bRT/

Answer 4

这是可以做到的，但并不容易。你必须破解 jQuery 本身，可能是这里。在 jQuery 开始在 while 循环内调用这些函数之前，您必须添加代码来检查 readyList 数组并根据您的偏好对元素重新排序。