的Javascript百分比計算欄寬

我需要計算電流值的百分比，將其連接到條寬度：的Javascript百分比計算欄寬

<div class="bar"><span class="bar-inside" data-value="120"></span></div> 
<div class="bar"><span class="bar-inside" data-value="1320"></span></div> 
<div class="bar"><span class="bar-inside" data-value="670"></span></div>

我需要找到最大值（在這種情況下，這將是1320），這將是100％，並根據計算其他鋼筋寬度的百分比。

謝謝！

來源

2013-03-15 ignaty

u能請創建的jsfiddle我們會全力協助 – Ronnie 2013-03-15 11:27:00

只是循環通過你的div，一個得到最大值..然後計算％ – MimiEAM 2013-03-15 11:29:33

var max = 0; 
$('.bar').each(function() { 
    max = Math.max(max, $('.bar-inside', this).data('value')); 
}) 
.css('width', function() { 
    return ($('.bar-inside', this).data('value') * 100/max) + '%'; 
});

http://jsfiddle.net/8nmhY/

來源

2013-03-15 11:47:23 dfsq

簡單而乾淨。謝謝！ – ignaty 2013-03-15 11:48:21

很高興幫助:) – dfsq 2013-03-15 11:48:55

這應做到：（fiddle）

var max = 0; 

$('.bar-inside').each(function(){ max = Math.max(max, $(this).data("value")); });

來源

2013-03-15 11:29:10 loxxy

它應該是$（「酒吧跨度」）？ – MimiEAM 2013-03-15 11:31:04

謝謝...沒有注意到範圍 – loxxy 2013-03-15 11:33:26

以及如何將所有值轉換爲％取決於最大值？ – ignaty 2013-03-15 11:46:08

var max = -Infinity; 

var maxEle = $(".bar").each(function() { 
    if (+this.attr('data-value') > max) +this.attr('data-value', max) ; 
}).filter(function() { 
    return this.attr('data-value') == max; 
}); 


if (maxEle.length > 1) maxEle = maxEle.eq(Math.floor(Math.random() * maxEle.length));

來源

2013-03-15 11:32:56 Vitthal

使用jquery .data（）代替attr＆手動解析... – loxxy 2013-03-15 11:43:56

使用map功能，然後Math.max。

var values = $.map($("span.bar-inside"), function(el, index) { return parseInt($(el).data('value')); }); 
var max = Math.max.apply(null, values);

以上將輸出1320其預期的結果。

來源

2013-03-15 11:35:54

的Javascript百分比計算欄寬

回答

相關問題