jQuery获得子div的最大宽度

时间:2011-04-25 23:29:50

标签: javascript jquery

我需要在包装器div元素中获取子div的最大宽度(只有一个宽度)

<div id="wrapper">  
    <div class="image"><img src="images/1.jpg"></div> 
    <div class="image"><img src="images/2.jpg"></div>  
    <div class="image"><img src="images/3.jpg"></div>  
    <div class="image"><img src="images/4.jpg"></div>  
    <div class="image"><img src="images/5.jpg"></div>  
    <div class="image"><img src="images/6.jpg"></div> 
</div>

3 个答案:

答案 0 :(得分:70)

Math.max.apply(Math, $('.image').map(function(){ return $(this).width(); }).get());

根据建议,我会打破这一点:

$('.image').map(function(){
   return $(this).width();
}).get();

以上获取所有.image div的列表,并将其转换为宽度列表。所以你现在有类似的东西:[200, 300, 250, 100, 400]。正如Felix指出的那样,.get()对于获取实际的数组而不是jQuery数组是必要的。

Math.max需要N个参数,因此您必须将其称为:Math.max(200, 300, 250, 100, 400),这是Math.max.apply作品完成的内容。

答案 1 :(得分:8)

要考虑的一个不那么困难的示例函数;不像cwolves那样优雅,但如果你是初学者,可能更容易理解。

function getMaxChildWidth(sel) {
    max = 0;
    $(sel).children().each(function(){
        c_width = parseInt($(this).width());
        if (c_width > max) {
            max = c_width;
        }
    });
    return max;
}

http://jsfiddle.net/userdude/rMSuJ/1/

答案 2 :(得分:4)

我喜欢这种方法,因为它在核心可读性和短缺之间达到了最佳点(恕我直言):

var max_w = 0;
$('#wrapper div.image').each(function() {
    max_w = Math.max(max_w, parseInt($(this).width()));
})

YMMV当然。