8

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

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

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

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

4

4 回答 4

7

以下是你将如何去做：

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

你可以在这里阅读更多关于它的信息

于 2010-08-13T18:59:43.440 回答
3

这些函数被添加到一个私有数组readyList中，所以我会说它无法进行操作。

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

于 2010-08-13T18:40:50.733 回答
2

您可以使用 jQuery Promise 来实现这样的目标。

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

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

    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>');
});

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

  2. 在下面的示例中，它与使用 jQuery.ready.promise 之前的示例完全相同。就像在小提琴中一样，它可以根据需要工作。

    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>');
});

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

于 2013-04-30T10:56:33.623 回答
1

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

于 2010-08-13T18:52:52.287 回答