JQuery получить максимальную ширину дочернего div

Мне нужно получить максимальную ширину (только одну ширину) дочернего 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>

Ответы

Ответ 1

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

В предположении, я сломаю это:

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

Вышеприведенный список всех .image divs и преобразует его в список их ширины. Итак, теперь у вас есть что-то вроде: [200, 300, 250, 100, 400]. .get(), как указал Феликс, необходимо для получения фактического массива вместо массива jQuery.

Math.max принимает N аргументов, поэтому вы должны называть его как: Math.max(200, 300, 250, 100, 400), что и выполняет Math.max.apply.

Ответ 2

Непростая примерная функция для рассмотрения; не так элегантно, как 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/

Ответ 3

Мне нравится этот подход, потому что он попадает в сладкое пятно (IMHO) между читабельностью и коротким ядром:

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

YMMV, конечно.