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 回答