1

正確に何かを成し遂げる方法について、私にはわずかなジレンマがあります。アイソトープと呼ばれるプラグインを使用して、組積造のレイアウトを持つポートフォリオをコーディングしています。基本的にはピンタレストスタイルのレイアウトです。また、データベースから適切なコンテンツを自動的に取得し、口ひげのテンプレートを使用して挿入するフィルターも用意します。今私が抱えている問題は、同位体リレーアウト機能を実行する前に、すべてのdom挿入が完了するのをどのように待つかです。実行が早すぎると、要素が適切に配置されないためです。データベース要求にかかる時間がわからないため、setTimeout（）関数を実行したくありません。また、ユーザーを長時間待機させたくありません。

助言がありますか？

4

3 に答える 3

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 に答える
0

挿入関数のコールバックでrelayOutメソッドを呼び出すことができます。

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

または、すべてのメソッドをチェーンとして指定できます

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

ajaxを使用してコンテンツを呼び出す場合は、jqueryajaxの成功コールバックの最後の行でrelayOutを呼び出すことができます。したがって、すべてのDOM操作は、relayOutメソッドを呼び出す前に実行されます。

アイソトーププラグインのコールバックとチェーンメソッドについては、 http：//isotope.metafizzy.co/docs/methods.htmlを参照してください。jquery ajaxの場合は、http： //api.jquery.com/jQuery.ajax/を参照してください。

于 2012-12-17T01:32:10.007 に答える
-3

現在、$（document）.ready（function（）内で関数を実行していますか？$（window）.load（function（）内で試すことができます。

于 2012-12-17T01:17:10.017 に答える