Javascript 如何设置jQuery函数的顺序，以便一个函数在另一个函数完成呈现内容后触发？

我正在使用砌体和嵌入插件来显示嵌入内容，我已经给出了一个示例

我的jQuery如下

//embedly

    $('.box').find('a').embedly({
      maxWidth: 260,
      wmode: 'transparent',
      method: 'after',
      chars: 50,
      width: 260,
      key:':cd54253e69944ae18ad5ece38b4d0e1e' //temporal
    });


//masonry

   var $container =  $('#main-container');

    $container.imagesLoaded( function(){
        $container.masonry({
          itemSelector: '.box',
          isAnimated: true,
          isFitWidth: true
      });
    });

---

它似乎是砌体插件首先加载，它导致了重叠问题（它们只有在调整结果窗口的大小时才能正确显示）。我已经读到，我可以使用回调函数或重新触发砌体嵌入完成渲染内容，但我不知道如何做。你能帮助我吗？是否有其他解决方案可以解决此问题？

您可以使用JQuery加载函数来包装砌体代码，该函数用于嵌入更新的div（使用

class=“box”

），如下所示：

---

您有一个异步计时问题。砌体布局代码在内容有机会加载之前触发

所以，您要做的是等待调用Mashise，直到加载完所有内容。您可能会尝试使用超时，这将导致竞争条件

理想情况下，Embeddely将拥有更好的API，并像ajax调用那样返回某种延迟承诺对象。不幸的是，这里似乎没有什么干净的东西，所以我们不得不做一些手工架

如果您定义了一个success:callback，那么显然您必须自己插入内容

幸运的是，Embeddely（）在加载和显示内容后触发自己的事件，您可以将回调绑定到该事件

可能有很多更优雅的方法来实现这一点，但为了使用丑陋的全局文件的一个简单示例，我们跟踪加载内容块的数量。每次Embeddely事件激发时，指示已加载一段内容，我们都会增加计数器。一旦我们达到匹配元素的总数，我们就知道所有内容都已加载，我们称之为砖石

虽然它不漂亮，但它可以工作：

---

我对这个插件不太了解，但这是因为它在这里的位置是绝对的

//masonry
 $('.box').load(function(){
       var $container =  $('#main-container');

        $container.imagesLoaded( function(){
            $container.masonry({
              itemSelector: '.box',
              isAnimated: true,
              isFitWidth: true
          });
        });
​ });​

    //embedly
var matches = $('.box').find('a').length;
var loaded = 0;

// we call this from the embedly callback after all 
// content has been loaded.
function callMasonry() {
    var $container = $('#main-container');

    $container.imagesLoaded(function() {
        $container.masonry({
            itemSelector: '.box',
            isAnimated: true,
            isFitWidth: true
        });
    });
}


var result = $('.box').find('a').embedly({
    maxWidth: 260,
    wmode: 'transparent',
    method: 'after',
    chars: 50,
    width: 260,
    key: ':cd54253e69944ae18ad5ece38b4d0e1e' //temporal
}).bind('embedly-oembed', function(e, oembed) {

    // not as elegant as I would like but increment
    // the counter. Once we have gotten to 
    // the number of matches call masonry
    //
    // It would be much cleaner if embedly could return some kind
    // of deferred object that gets resolved after all matched
    // content has been loaded. 

    loaded++;

    console.log("loaded " + oembed.title);

    if (loaded == matches) {
        callMasonry();
    }


});;