0

jQuery.load（）で読み込まれたコンテンツに基づいて、divコンテナの高さを動的に変更しようとしています。私はコードを配置するさまざまな方法を試し、ここで多くの投稿を検索して表示し、jQueryのドキュメントを読みました。ページの読み込み後にFirebugコンソールで実行すると関数は機能しますが、コードが保存されてページとともに読み込まれると機能しません。スクリプトをページで実行すると、コンソールはすべてのテーブルの高さに対して「0」を出力しますが、firebugで実行すると適切な高さが表示されます。

コードは以下のとおりです。基本的に、これは私がこのスクリプトを貼り付けたユーザー定義のページであり、div＃element4はjQuery内のjQueryタブにあります。コードのエラーを見つけたり、コードを機能させるのを手伝ってもらえますか？ 

$("#element4").load("<dbid>?act=API_GenResultsTable&qid=8", function(response, status, xhr) {
 if (status == "success") {
    $('#element4 table').each( function(x, y){
    var max_height = 0;  
    var yHeight = $(y).height();
    max_height = ( yHeight > max_height) ? yHeight : max_height;
    $('#element4').height(max_height);
    console.log(max_height);
  });
  }
 });
4

2 に答える 2

0

max_heightごとにゼロにリセットしていますtable。each高さの最終的な設定とともに、ループの外に移動してみてください。

var max_height = 0; // init max
// find tallest table
$('#element4 table').each(function(x, table) {
    var yHeight = $(table).height();
    max_height = (yHeight > max_height) ? yHeight : max_height;
});
$('#element4').height(max_height); // set height
console.log(max_height);
于 2012-09-04T22:08:46.887 に答える
0

$（ "＃tabs"）。tabs（）;でタブを作成する前に、$。load（）を使用して外部コンテンツをロードすることで、この問題の回避策を見つけることができました。次に、上記に投稿したものと同様のスクリプトを使用しました。これは最後に実行されます。したがって、コンテンツをロードし、タブを作成し、divのサイズを変更します。

$('#ELEMENTID table').each(function (x, y) { //find table heights in the <div> 
var max_height = 0;
var yHeight = $(y).innerHeight();
max_height = (yHeight > max_height) ? yHeight : max_height;
var compHeight = max_height + 24; //adding 24 because it was the standard height for the smallest of 3 tables.. 
$('#element3').height(compHeight);
console.log(compHeight);

誰かがより良い解決策を持っているなら、それは大いにありがたいです。

于 2012-09-05T17:35:37.610 に答える