jQuery或Javascript将所有按钮设置为最宽按钮的宽度

Question

我的客户希望我编写一段代码，首选jQuery，它将所有链接设置为最宽链接的相同宽度。以下是HTML：

<div> 
<h1>HEADER</h1> 
<p style="text-align: right;" class="floatRight"><a href="#" class="small-button eLength"><span>BUTTON 1</span></a></p> 
<p style="text-align: right;" class="floatRight"><a href="#" class="small-button eLength"><span>BUTTON 2</span></a></p> 
<p style="text-align: right;" class="floatRight"><a href="#" class="small-button eLength"><span>BUTTON LONGEST</span></a></p> 
</div> 

CSS将所有三个按钮设置为最小宽度180px。我在寻找这一切视乎类：eLength

Answer 1

你可以得到最大宽度是这样的：

var widest = Math.max.apply(Math, $('.eLength').map(function() { 
    return $(this).width(); 
})); 

而在一个条子插件来包装这个：

$.fn.widest = function() { 
    return this.length ? this.width(Math.max.apply(Math, this.map(function() { 
     return $(this).width(); 
    }))) : this; 
}; 

$('.eLength').widest(); 

Answer 2

使用约翰Resig的Fast JavaScript Max/Min：

Array.max = function(array) { 
    return Math.max.apply(Math, array); 
}; 

var widths = new Array(); 
$('.eLength').each(function(index) { 
    widths.push($(this).width()); 
}); 

alert("Max Width: " + Array.max(widths));