jQuery来使相邻的div相同的高度

-1

<div class="field-label-inline"> 
    <div class="field-label">something1</div> 
    <div class="field-items"> 
    <div class="field-item">sometext1</div> 
    </div> 
</div> 
<div class="field-label-inline"> 
    <div class="field-label">something2</div> 
    <div class="field-items"> 
    <div class="field-item">sometext2</div> 
</div>

我想使点域标签的所有实例的div相同的高度相邻.field-items div（这个div的高度根据其内容而变化）。可悲的是我的jQuery几乎不存在;这里是我最好的，但失败的尝试：

$(document).ready(function(){  

    $('.field-label-inline > .field-label', this).each(function(){ 

    var itemsHeight = 0; 

    itemsHeight = $(this + .field-items).height(); 

    $(this).height(itemsHeight); 

    }); 
});

来源

2013-03-20 elb

为什么不能你只需要使用CSS？ – Igor 2013-03-20 18:56:37

使用.height（）.http：//api.jquery.com/height/ – rnirnber 2013-03-20 18:58:35

给你点域，标签内嵌类固定高度，说500像素，然后给点域，标签和点域项的100％的高度。我会在CSS中这样做，但jQuery下面。

$(".field-label-inline").css("height","500px"); 
$(".field-label").css("height","100%"); 
$(".field-items").css("height","100%");

来源

2013-03-20 18:58:25 TJC

的点域项DIV高度取决于点域项目div的内容，所以CSS不能提供解决方案有所不同。它必须是动态的。 jQuery需要找到每个.field-items div的高度并将其应用于.field-lable div。不幸的是，这是我无法解决jQuery的问题。 – elb 2013-03-21 07:39:34

最后。这工作。我不知道这是否是一个'好'的解决方案。

$(document).ready(function(){  

    $('.field-label-inline .field-label').each(function(){ 

    var itemsHeight = 0; 

    itemsHeight = $(this).next().height(); 

    $(this).height(itemsHeight); 

    }); 
});

来源

2013-03-21 09:04:31 elb

对我来说看起来还不错，尽管缩进可以修复。另外，你可以合并两行：var itemsHeight = $（this）.next（）。height（）'。 – halfer 2018-01-08 18:42:34

jQuery来使相邻的div相同的高度

回答

相关问题