Javascript 列和表具有相同行高的引导行
我有x个引导行和y个引导列,x和y取决于数据库查询。 在y列中,数据加载到html表中。 因为表格是可编辑的,所以我尝试将表格行高度设置为每个div.row中所有div.column中最高字段的高度 这是我要格式化的页面部分。 因此,我需要访问div.column和div.row中每个html表的每个'tr',检查哪一个是最高的tr,并将此高度应用于同一行中的另一个tr,并对每个div.row应用不同的高度Javascript 列和表具有相同行高的引导行,javascript,html,jquery,Javascript,Html,Jquery,我有x个引导行和y个引导列,x和y取决于数据库查询。 在y列中,数据加载到html表中。 因为表格是可编辑的,所以我尝试将表格行高度设置为每个div.row中所有div.column中最高字段的高度 这是我要格式化的页面部分。 因此,我需要访问div.column和div.row中每个html表的每个'tr',检查哪一个是最高的tr,并将此高度应用于同一行中的另一个tr,并对每个div.row应用不同的高度 <div id="main" > <?php $
<div id="main" >
<?php
$a=0;
$result = $conn->query($query);
while ($row = $result->fetch_assoc()) {
$task[$a] = ( $row['task'] );
$a++;
}
$b=0;
foreach ($task as $row){
?>
<?php
$query1 = ("SELECT step FROM somewhere where id = '$id' AND task = '$task'");
$result1 = $conn->query($query1);
$c=0;
while ($row1 = $result1->fetch_assoc()) {
$step[$c] = ( $row1['step'] );
$c++;}
$d=0;
?>
<div class="row">
<div class="column" >
<?php
include'tabelle_index.php'; // first html table of a div.row with the legend
?>
</div>
<?php
foreach ($step as $row){
?>
<?php $st= $step[$b];?>
<div class="column">
<?php include'tabelle_data.php'; ?> // html tables with the data from database
</div>
<?php
$d++;
}
unset($step);
unset ($c);
?>
</div>
<?php
$b++;
}
?>
预览:
目前,这段代码对我有效:
jQuery.fn.GetIndex = function() {
return $(this).parent().children().index($(this));
}
$('.row').each(function(){
var rows = $('table tr', this);
rows.each(function() {
var i = $(this).GetIndex() + 1;
var highesttr = 0;
if(rows.filter(':nth-child(' + i + ')').height() > highesttr) {
highesttr = $(this).height();
}
rows.filter(':nth-child(' + i + ')').height(highesttr);
});
});
我认为动态高度是不可能的。您可能需要查看CSS属性
display:table cell
。
jQuery.fn.GetIndex = function() {
return $(this).parent().children().index($(this));
}
$('.row').each(function(){
var rows = $('table tr', this);
rows.each(function() {
var i = $(this).GetIndex() + 1;
var highesttr = 0;
if(rows.filter(':nth-child(' + i + ')').height() > highesttr) {
highesttr = $(this).height();
}
rows.filter(':nth-child(' + i + ')').height(highesttr);
});
});