1

私は要素でAjaxingしています。高さに基づいて配置する場所を決定したい (ボックス パッキング タイプのアルゴリズムを考えてください)。

このように要素をループすると、常に次のよう0になりouterHeightます。

posts.each(function(i, e) {
    var elementHeight = $(e).outerHeight();
    // elementHeight is always 0
});

要素の表示高さを取得するにはどうすればよいですか?


高さを取得するには、要素をページに追加する必要があるようです。これは理にかなっています。
できるだけ簡単にユーザーに見えないようにしながらこれを行う最良の方法は何ですか?

4

2 に答える 2

1

投稿をhidden(display: none) div 要素に追加し、それらを繰り返し処理してそれぞれのouterHeight値を取得します。

HTML

<div id="postContainer"></div>

CSS

#postContainer { display: none;}

JS

var cont = $('#postContainer'), postsLength = posts.length;
posts.each(function(i, e) {
    cont.append(e);
    if (!--postsLength) calcOuterHeight();
});

function calcOuterHeight(){
    cont.find('.posts').each(function(i, e){
        var oh = $(e).outerHeight();
    })
}
于 2012-10-16T08:26:08.600 に答える
1

要素がレイアウト プロセスを通過するようにページに要素を追加する必要があります。その後、サイズが設定されます。

それらを本体に追加し、高さを取得してから削除できます。要素がページ内にある間、ブラウザはコードの実行に忙殺されるため、要素が表示されることはありません。

var el = $('<div>test</div>');
$(document.body).append(el);
var h = el.height();
el.remove();
于 2012-10-16T08:20:56.220 に答える