1

我对如何完成某事有点进退两难。我正在使用一个名为 isotope 的插件编写一个具有砖石布局的投资组合。它基本上是 pinterest 风格的布局。我还将有过滤器，这些过滤器会自动从数据库中获取正确的内容并使用小胡子模板将其插入。现在我遇到的问题是如何在运行同位素中继输出功能之前等待所有 dom 插入完成。因为如果我过早运行它，元素将无法正确定位。我不想做一个 setTimeout() 函数，因为我不确定数据库请求需要多长时间，我不想让用户等待太久。

有什么建议么？

4

3 回答 3

0

您可以在 insert 函数的回调中调用 relayOut 方法。

$('#container').isotope( 'insert', /*items*/ ,function(){
  $('#container').isotope( 'reLayout', callback );
} );

或者您可以将所有方法作为链

$('#container').isotope( 'insert', /*items*/).isotope( 'reLayout', callback );

如果您使用 ajax 调用您的内容，您可以在 jquery ajax 的成功回调的最后一行调用您的 relayOut。所以每个 DOM 操作都是在调用 relayOut 方法之前完成的。

同位素插件的回调和链接方法参考http://isotope.metafizzy.co/docs/methods.html。对于 jquery ajax，请通过http://api.jquery.com/jQuery.ajax/

于 2012-12-17T01:32:10.007 回答
0

查看 jQuery Deferred.done()

以下是该网站的示例： 

<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>

 <button>Go</button>
 <p>Ready...</p>

<script>
/* 3 functions to call when the Deferred object is resolved */
function fn1() {
  $("p").append(" 1 ");
}
function fn2() {
  $("p").append(" 2 ");
}
function fn3(n) {
  $("p").append(n + " 3 " + n);
}

/* create a deferred object */
var dfd = $.Deferred();

/* add handlers to be called when dfd is resolved */
dfd
/* .done() can take any number of functions or arrays of functions */
.done( [fn1, fn2], fn3, [fn2, fn1] )
/* we can chain done methods, too */
.done(function(n) {
  $("p").append(n + " we're done.");
});

/* resolve the Deferred object when the button is clicked */
$("button").bind("click", function() {
  dfd.resolve("and");
});
</script>

</body>
</html>

网站上也有一个演示。

于 2012-12-17T01:23:10.957 回答
-3

您当前是否在 $(document).ready(function() 中运行该函数？也许您可以在 $(window).load(function() 中尝试它。

于 2012-12-17T01:17:10.017 回答